Filter for StackOverflow

by VtoCorleone

HTML

<script src="http://cdn.kendostatic.com/2012.2.710/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.blueopal.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.common.min.css">
<input  id="date1" type="text" value="03/30/1969" />
<input  id="date2" type="text" value="12/01/1983" />
<button id="filterData" type="button">Filter Data</button>

<br /><br />

<div id="testGrid"></div>

JavaScript

var firstNames = ["Nancy", "Andrew", "Janet", "Margaret", "Steven", "Michael", "Robert", "Laura", "Anne", "Nige"],
    lastNames = ["Davolio", "Fuller", "Leverling", "Peacock", "Buchanan", "Suyama", "King", "Callahan", "Dodsworth", "White"],
    birthDates = [new Date("1948/12/08"), new Date("1952/02/19"), new Date("1963/08/30"), new Date("1937/09/19"), new Date("1955/03/04"), new Date("1963/07/02"), new Date("1960/05/29"), new Date("1958/01/09"), new Date("1966/01/27"), new Date("1966/03/27"), new Date("1973/01/12"), new Date("1983/12/01"), new Date("1969/03/30"), new Date("1992/04/09"), new Date("1993/08/12")];

function createRandomData(count) {
    var data = [],
        now = new Date();
    for (i = 0; i < count; i++) {
        var firstName = firstNames[Math.floor(Math.random() * firstNames.length)],
            lastName = lastNames[Math.floor(Math.random() * lastNames.length)],
            birthDate = birthDates[Math.floor(Math.random() * birthDates.length)];

        data.push({
            FirstName: firstName,
            LastName: lastName,
            DOB: birthDate
        });
    }
    return data;
}

var columnDefinitions = [
    {
    field: "FirstName",
    title: "First Name"},
{
    field: "LastName",
    title: "Last Name"},
{
    field: "DOB",
    title: "DOB",
    template: "#= kendo.toString(DOB,'MM/dd/yyyy') #"}];


function createGrid() {
    $("#testGrid").html("").kendoGrid({
        dataSource: {
            data: createRandomData(100),
            pageSize: 10
        },
        columns: columnDefinitions,
        pageable: {
            pageSizes: true
        },
        sortable: {
            mode: "single",
            allowUnsort: true
        },
    });
}

function filterData() {

    var gridData = $("#testGrid").data("kendoGrid").dataSource;
    var date1 = new Date($("#date1").val());
    var date2 = new Date($("#date2").val());

    var customFilter = {
        logic: "and",
        filters: []
    };

   ...