kendo-uikendo-gridkendo-datepicker

KendoGrid dynamic date filters in European format are getting reversed from dd/mm/yyyy to mm/dd/yyyy


I have a KendoGrid with a filterable European format date column with date operators for eq, gt, lt, gte, lte and I am trying to set it dynamically from JavaScript

columns:

{ field: "myDate", sortable: true, filterable: { ui: function(element) { element.kendoDatePicker({ format: "dd/MM/yyyy" }); } }, title: "my dte", width: "150px", minResizableWidth: "25", format: "{0:dd/MM/yyyy}" }

when I am trying to set the filter date dynamically like this:

filter.filters[0].value = '12/05/2019' 

the dates are getting reversed to 05/12/2019 and if I try with dates where the first part which is supposed to be the day is bigger than 12 (ex: 13/12/2019), the filters are showing up empty. The thing is that even if I reverse the date that I am passing with something like:

e=d.substr(0,5).split("/").reverse().join("/")+d.substr(5)

the filters WILL be shown in the filters fields, but they are not working.

DEMO link with instruction to reproduce: https://dojo.telerik.com/OGUgiGex


Solution

  • In your link, when the filter change you set the value of filters with a string like this :
    "value":"10/15/2016" and "value":"12/19/2022"

    You should use a Date like this :
    "value":new Date("2019-10-15") and "value":new Date("2022-12-19")

    You can use another way to construct the Date, the main point is to use Date instead of string in your filter setting.