Grid Filters with Date

3 posts, 0 answers
  1. Hayfa
    Hayfa avatar
    9 posts
    Member since:
    Sep 2015

    Posted 04 Feb Link to this post

    Hi,

    I have a grid with json kendo datasource .

    My date value : Wed Jan 27 2016 15:59:42 GMT+0100 (Romance Standard Time), and in the schema/data/model I specifiy my column type: "date" and in the grid/columns i specify the format: "MM/dd/yyyy", no problem with displaying date in grid, but I want to filter my date without time ,If I pull down the column filter and pick equal to 01/27/2012 nothing shows.

    My code :

    <code style="color: #000;">$scope.mainGridOptions = {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>        filter: "contains",<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>        dataSource: {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            type: "odata-v4",<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            filter: {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                logic: "and",<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                filters: [<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                    {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                        field: "deleted",<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                        operator: "eq",<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                        value: false<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                    }<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                ]<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            },<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            transport: {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                read: {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                    url: + '/odata/unites',<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                },<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            },<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            serverPaging: true,<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            serverSorting: true,<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            serverFiltering: true,<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            pageSize: 5<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>        },<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>        sort: {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            field: "id",<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            dir: "desc"<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>        },<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>        schema: {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            model: {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                id: "id",<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                fields: {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                    createdon: { type: "date" },<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                    titre: { type: "string" }<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>                }<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            }<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>        },<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>        groupable: true,<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>        sortable: true,<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>        filterable:true,<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>        pageable: {<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            refresh: true,<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            pageSizes: true,<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            buttonCount: 5<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>        },<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>        selectable: true,<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>     <</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>        columns: [<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            { field: "createdon", title: "Date", type: "date", template: "#= createdon ? getDate.formatDate(createdon, 'L') : ''#" , width:"50%" },<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>            { field: "titre", title: "Nom", width: "50%" }<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>        ]<</code><code style="color: #069;font-weight: bold;">br</code><code style="color: #000;">>    };</code>

    Thanks & Regards.

  2. Hayfa
    Hayfa avatar
    9 posts
    Member since:
    Sep 2015

    Posted 04 Feb in reply to Hayfa Link to this post

    Hayfa said:

    Hi,

    I have a grid with json kendo datasource .

    My date value : Wed Jan 27 2016 15:59:42 GMT+0100 (Romance Standard Time), and in the schema/data/model I specifiy my column type: "date" and in the grid/columns i specify the format: "MM/dd/yyyy", no problem with displaying date in grid, but I want to filter my date without time ,If I pull down the column filter and pick equal to 01/27/2012 nothing shows.

    My code :

    $scope.mainGridOptions = {
            filter: "contains",
            dataSource: {
                type: "odata-v4",
                filter: {
                    logic: "and",
                    filters: [
                        {
                            field: "deleted",
                            operator: "eq",
                            value: false
                        }
                    ]
                },
                transport: {
                    read: {
                        url: MyUrl+ '/odata/unites',
                    },
                },
                serverPaging: true,
                serverSorting: true,
                serverFiltering: true,
                pageSize: 5
            },
            sort: {
                field: "id",
                dir: "desc"
            },
            schema: {
                model: {
                    id: "id",
                    fields: {
                        createdon: { type: "date" },
                        titre: { type: "string" }
                    }
                }
            },
            groupable: true,
            sortable: true,
            filterable:true,
            pageable: {
                refresh: true,
                pageSizes: true,
                buttonCount: 5
            },
            selectable: true,
           
            columns: [
                { field: "createdon", title:"Date", type: "date", template: "#= createdon ? getDate.formatDate(createdon, 'L') : ''#" , width:"50%" },
                { field: "titre", title: "Nom", width: "50%" }
            ]
        };

    Thanks & Regards.
  3. Tsvetina
    Admin
    Tsvetina avatar
    1876 posts

    Posted 09 Feb Link to this post

    Hello Hayfa,

    Please note that this is the Telerik Platform forum where problems related to the Telerik Platform products and services only are discussed. You can post in the Kendo UI forums or Stack Overflow to enquire about Kendo UI. 

    Also, a quick search produced this result, so you can check it out before opening a new thread:
    Display Kendo Grid column as DateTime but ignore Time when filtering


    Regards,
    Tsvetina
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top