Home > Software design >  How to display DateTime when using a datatable?
How to display DateTime when using a datatable?

Time:07-01

I am building a web app in ASP.NET Core using Razor Pages. However, i also wanted to try using some javascript to display a datatable. I want to display the properties StartTime, EndTime, and Added, which are of the type DateTime. But i cannot get it to work without doing a lot of background conversions.

My question is, what would be the simplest way to display the values stored in the DateTime properties?

This is what my js-file looks like, it displays information from an object of the custom class Shift:

$(document).ready(function () {

    
    $('#DT_load').DataTable({
        "ajax": {
            "url": "/api/Shift",
            "type": "GET",
            "datatype":"json"
        },
        "columns": [
            { "data": "user.name", "width": "25%" },
            { "data": "location.name", "width": "25%" },
            {**<!-- Here i want to display DateTime properties values -->**
                "data": "id",
                "render": function (data) {
                    return `<div  >
                            <a href="/Admin/Shifts/upsert?id=${data}" >
                            <i ></i> </a>
                            <a href="/Admin/Shifts/upsert?id=${data}"  >
                            <i ></i> </a>
                            </div>`

                },
                "width":"15%"
            },
        ],
        "width":"100%"
    });
});

I am using a controller that gets all properties with specific properties, but including the properties doesn't work either.

CodePudding user response:

My question is, what would be the simplest way to display the values stored in the DateTime properties?

If you want to show datatime type data in datatable,you only need to show it directly.For example:

model:

public class CustomerModel{
    public DateTime StartTime { get; set; }
}

action:

public IActionResult Shift()
        {
            List<CustomerModel> l = new List<CustomerModel> { new CustomerModel { StartTime = new DateTime(2022, 7, 1) }, new CustomerModel {  StartTime = new DateTime(2022, 7, 1) } };

            return new JsonResult(l);
        }

js:

$(document).ready(function () {

    
    $('#DT_load').DataTable({
        "ajax": {
            "url": "/api/Shift",
            "type": "GET",
            "datatype":"json"
        },
        "columns": [
            { "data": "startTime", "width": "25%" },
        ],
        "width":"100%"
    });
});
  • Related