Assign ID To Column Filter Datepickers

[Jeff]

I have a Grid that has two Date field columns. I've implemented filters for both columns as shown below.  I'd like to assign an ID to the 4 datepickers that are created to be able to reference them later. 

  field: "issuedDate",
            title: "Issued Date",
            template: '#= kendo.toString(new Date(issuedDate), "MM/dd/yyyy HH:mm" ) #',
            width: "140px",
            filterable: {
                ui: "datepicker",
                //extra: true,
                operators: {
                    date: {
                        gte: "From",
                        lte: "To",
                    }
                },
                messages: { "info": "Issued Date From -> To " },
            }

field: "receivedDate",
            title: "Received Date",
            template: '#= kendo.toString(new Date(receivedDate), "MM/dd/yyyy HH:mm" ) #',
            width: "140px",
            filterable: {
                ui: "datepicker",

                operators: {
                    date: {
                        gte: "From",
                        lte: "To",
                    }
                },
                messages: { "info": "Received Date From -> To " },
            }

 

 

 

[Jeff]

This is what the GUI looks like

[Nikolay]

Hello Jeff,

In general, the Column filter DatePickers can be referenced in the filterMenuInit event handler via the e.container event data that will return the object representing the filter menu form element. For example:

filterMenuInit: function(e) {
    if (e.field == "date") {
     // get reference of the first DatePicker for "date" column
      var firstDatePicker = e.container.find("input:eq(0)").data("kendoDatePicker");
    }
  }

The above can be examined live in the following Dojo demo:

• https://dojo.telerik.com/IROyAdey

let me know if you have any questions.

Regards,
Nikolay
Progress Telerik