This is a migrated thread and some comments may be shown as answers.

Date Columns handling in grid

3 Answers 699 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Sapandeep
Top achievements
Rank 1
Sapandeep asked on 09 Jan 2019, 10:10 PM

I am getting  Data from Web API as array of object with one of the object's property/field as Date field. on API side its handled and returned as date . But when the data is retrieved after Ajax call ,  Grid (most likely Javascript as well) treat it as  string and grid shows something like "2019-01-01T00:00:00".

I  tried to use column.format to display it as date . which doesn't work .

Then i used Template to parse it using kendo.toString which worked, 

But when i export grid to Excel or PDF it still shows 2019-01-01T00:00:00 

Also i am trying to use Filter option on Column and trying to use Datetimepicker

column.filter.ui ="datetimepicker" 

which shows the date picker but filter doesn't work.

 

Could you please suggest some solution  or is there any step i am missing. 

 

Thanks

3 Answers, 1 is accepted

Sort by
0
Accepted
Tsvetina
Telerik team
answered on 11 Jan 2019, 09:27 AM
Hello Sapandeep,

Make sure you declare the date fields in your Grid dataSource.schema:
$("#grid").kendoGrid({
    dataSource: {
        type: "odata",
        transport: {
        },
        schema: {
            model: {
                fields: {
                    OrderID: { type: "number" },
                    Freight: { type: "number" },
                    ShipName: { type: "string" },
                    OrderDate: { type: "date" },
                    ShipCity: { type: "string" }
                }
            }
        },
        pageSize: 20,
        serverPaging: true,
        serverFiltering: true,
        serverSorting: true
    },
    height: 550,
    filterable: true,
    sortable: true,
    pageable: true,
    columns: [{
            field:"OrderID",
            filterable: false
        },
        "Freight",
        {
            field: "OrderDate",
            title: "Order Date",
            format: "{0:MM/dd/yyyy}"
        }, {
            field: "ShipName",
            title: "Ship Name"
        }, {
            field: "ShipCity",
            title: "Ship City"
        }
    ]
});

This tells the DataSource to parse the OrderDate field to a Date value and it is then properly formatted and filtered by the Grid.

You can see an example in the Remote Binding demo.

Regards,
Tsvetina
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Sapandeep
Top achievements
Rank 1
answered on 16 Jan 2019, 06:46 PM

Thanks Tsvetina,

Thats resolves the issue for date field. I have dateTime field as well and setting type as "date" and setting  format: "{0:M/d/yyyy hh:mm:ss tt}" shows correct data on grid . however when i export the grid it shows only date part. is there any datetime field type or i have to write code to export Date time values on grid export call ?

0
Accepted
Tsvetina
Telerik team
answered on 17 Jan 2019, 04:02 PM
Hello Sapandeep,

On the client-side there is a single Date type that is used for both date and time values. To format the date in the Excel file, follow the instructions provided here:
Set Cell Format During Excel Export (see second example)

Here is a Dojo example where I apply the required format to the third Grid column:
https://dojo.telerik.com/ezajeDIk

Regards,
Tsvetina
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Grid
Asked by
Sapandeep
Top achievements
Rank 1
Answers by
Tsvetina
Telerik team
Sapandeep
Top achievements
Rank 1
Share this question
or