Grid with Datepicker in Toolbar

[vitaliy]

Hi.
There is grid:

@(Html.Kendo().Grid<OperMVC.Models.Daily>()
    .Name("Grid")
    .Columns(c => {
        c.Bound(p => p.Name).Width(150);
        c.Bound(p => p.BDayDate).Width(50);
    })
    .ToolBar(toolbar =>
    {
        toolbar.Template(
            @<div><label>BDate: </label>
            @(Html.Kendo().DatePicker()
                .Name("datepicker")
                .Events(e => e.Change("GetDate"))
                .Value(DateTime.Today)
                .Format("dd.MM.yyyy")
            )</div>
        );
    })

    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("ReadBDays", "Person").Data("filterDate"))
        //.ServerOperation(true)
    )



)

and js script for DatePicker Event:

function GetDate() {
        var value = this.value();
        var date = new Date();
        if (value) {
            date.setTime(Date.parse(value));
            console.log(date.toLocaleDateString());
        }
        $("#Grid").data("kendoGrid").dataSource.read();

    }

js function for filter data by date:

function filterDate() {
        var date = $("#datepicker").data("kendoDatePicker").value();
        console.log("filtered date:" + date);
        return {dateString : date}
    }

When I select the date, then update the Grid as I need, but if I want to choose a new date, it opens a DatePicker without any a dates. you have to change the month and return back, then there are only dates
Attach screenshot

[vitaliy]

I Tried to move the DatePicker outside the table - the effect is the same. DatePicker problem?

[vitaliy]

i solved the problem.

[JSeeger]

What was the solution?

[vitaliy]

i used that js scritp to collapse grouped row in my grid on DataBound Event:

function collapseGroupRows() {
        var grid = $("#Grid").data("kendoGrid");
        grid.collapseGroup(grid.tbody.find("tr.k-grouping-row"));
        $('tr[role*="row"]').slice(1).hide();
    }

-  It is troble)

I changed script on:

function collapseGroupRows() {
        var grid = $("#Grid").data("kendoGrid");
        var groups = grid.tbody.find(">tr.k-grouping-row");
        for (var i = 0; i < groups.length; i++) {
            grid.collapseGroup(groups.eq(i));
        }

    }

and everything works fine=)