Searching Records from the Kendo Grid by Date given in the Search Box.

While working on a project I came to an issue in kendo grid i.e to search the Grid records using Date.
Say , I had an accounts list from a bank in which lots of data are displayed including A/C opening date, Last log-in, Last transaction, Last Unsuccessful Log-in and there is a search box that finds the records when the date is given in the search box. But to my dismay it doesn't works for me, after spending a valuable of 1 day of my work , I had got the success.

So here is the image below:

The Code to make your grid work for dates filtration or searching:

In the web page(.html / .cshtml / .jsp etc)
<div id="grid"></div>

Script:
<script type="text/javascript">

$(document).ready(function () {

       initGrid();

      
/// This function is called when you start typing in the search textbox. Here Id of search textbox is #search.

    $('#search').keyup(function () {

        clearTimeout($.data(this, 'timer'));

        var wait = setTimeout(searchDataSource, 500);

        $(this).data('timer', wait);

    });

});

 function searchDataSource() {

        var query = $("#search").val();

        var $filter = [

                       { field: "AccOpenDate", operator: "eq", value: new Date(query) },

                       { field: "LastLogin", operator: "eq", value: new Date(query) },

                       { field: "LastTrans", operator: "eq", value: new Date(query) },

                       { field: "FaliureLogin", operator: "eq", value: new Date(query) }

        ];

        if (query.length > 2)  // search only when the no. of character typed is greater than 2

        {

            grid.data("kendoGrid").dataSource.filter({

                logic: "or",

                filters: $filter

            });

        } else if (query.length == 0)

            grid.data("kendoGrid").dataSource.filter([]);

    }

 function initGrid() {

        grid = $("#grid").kendoGrid({

            dataSource: {

                transport: { read: "/Bank/accounts" },

                schema: { data: "Data", total: "Total" },

                pageSize: 30,

                serverPaging: false,

                serverFiltering: false,

                serverSorting: false

            },

            height: gridHeight,

            change: function () {

                var selectedRows = this.select();

                selectedElement = this.dataItem(selectedRows[0]);

                showActionPane(selectedElement.Name != null && selectedElement.Name != "");

            },

            selectable: "single",

            filterable: true,

            sortable: true,

            pageable: true,

            resizable: true,

            columns: [

                { field: "Name", title: "Name", width: 60, template: '<a href="/Account/Details/#=Id#">#=Name#</a>' },

                { field: "Status", title: "Status", width: 50 },

                { field: "AccountType", title: "Account Type", width: 80 },

                { field: "AccOpenDate", title: "A/c Open Date", width: 50, template: '#=(AccOpenDate==null)?"":kendo.toString(kendo.parseDate(AccOpenDate,"0:MM/dd/yyyy"),"MM/dd/yyyy") #', filterable: true, format: "{0:M/d/yyyy}", type: "date" },

                { field: "LastLogin", title: "Last Login", width: 50, template: '#=(LastLogin==null)?"":kendo.toString(kendo.parseDate(LastLogin,"0:MM/dd/yyyy"),"MM/dd/yyyy") #', filterable: false, format: "{0:M/d/yyyy}", type: "date" },

                { field: "LastTrans", title: "Last Transaction", width: 50, template: '#=(LastTrans==null)?"":kendo.toString(kendo.parseDate(LastTrans,"0:MM/dd/yyyy"),"MM/dd/yyyy") #', filterable: false, format: "{0:M/d/yyyy}", type: "date" },

                { field: "FaliureLogin", title: "Unsuccessful Login", width: 50, template: '#=(FaliureLogin==null)?"":kendo.toString(kendo.parseDate(FaliureLogin,"0:MM/dd/yyyy"),"MM/dd/yyyy") #', filterable: false, format: "{0:M/d/yyyy}", type: "date" }

            ]

        });

    }

output:
Search records by Date through Search Textbox text:  ( here searching the record occurs on all the columns)

Search records by Date through filter Button: ( here searching the record which has opened on 04/04/2013. So two records where as in the above it is searching all the columns having 04/04/2013. so three records.