Связывание данных сетки Kendo после выбора из поля

Question

У меня есть экран, где у меня есть Kendo grid. У меня dropdown с годами, и если я выберу год, сетка должна обновиться соответствующими данными.

Но после выбора даты возвращаемый результат - результат JSon

Что мне здесь не хватает?

Это сетка:

@(Html.Kendo().Grid<GGISServices.Models.District.LotAutorizationSentDocumentsViewModel>()
    .Name("districtGrid")
    .HtmlAttributes(new { @class = "newGrid" })
    .Columns(columns =>
    {
        ....     
    })
    .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
    .Events(e => e.FilterMenuInit("filterMenuInit"))
    .ColumnMenu(f => f.Enabled(true))
    .Pageable(pageable => pageable
        .Refresh(true)
        .Info(true)
        .PageSizes(new int[] { 5, 10, 25, 50, 100, 1000 })
        .ButtonCount(5)
        )
    .DataSource(dataSource => dataSource
        .Ajax()
        .Sort(sort => sort.Add(c => c.Id).Descending()) // <-- initial sort expression
        .Read(read => read.Action("GetData", "SentDocument", new { Area = GGISWeb.AreaModules.District }))
        .PageSize(25)
    )
    )

Это метод GetData из controller:

public ActionResult GetData([DataSourceRequest]DataSourceRequest request, int year = 0)
    {
        var list = dsService.GetSentDocumentsAsQueryable(year);
        DataSourceResult result = list.ToDataSourceResult(request, x => x.ToViewModel());
        return new LargeJsonResult() { Data = result , JsonRequestBehavior = JsonRequestBehavior.AllowGet };
    }

и это onChange событие года:

$(document).ready(function () {
       $("#Year").on("change", function (e) {
           $("#gridDiv").load("@VirtualPathUtility.ToAbsolute("~/")District/SentDocument/GetData/?year=" + $(this).val(), function () {
              });
        });
    });

Когда я выбираю другую дату, метод GetData вызывается с выбранным годом, но я не знаю, как привязать к сетке.

Answer 1

Использование подхода @Mark_Fitzpatrick будет работать, но проблема в том, как ваш контроллер отправляет обратно информацию из-за подобных проблем. Сетка ожидает ответа на запрос DataSourceResult, и вы изменяете ожидаемую схему. так что изменив свой контроллер с:

public ActionResult GetData([DataSourceRequest]DataSourceRequest request, int year = 0)
    {
        var list = dsService.GetSentDocumentsAsQueryable(year);
        DataSourceResult result = list.ToDataSourceResult(request, x => x.ToViewModel());
        return new LargeJsonResult() { Data = result , JsonRequestBehavior = JsonRequestBehavior.AllowGet };
    }


    public ActionResult GetData([DataSourceRequest]DataSourceRequest request, int year = 0)
        {
            var list = dsService.GetSentDocumentsAsQueryable(year);


            return Json(list.ToDataSourceResult(request, ModelState),JsonRequestBehavior.AllowGet);


        }

Это должно вернуть данные в формате, ожидаемом сеткой. Если данные велики и предполагается, что LargeJsonResult является пользовательским возвращаемым объектом, вы можете просто вернуть JsonResult с назначенной настройкой максимальной длины.

Answer 2

Попробуйте другой подход. Используйте метод .Data () для обозначения функции javascript, которая будет возвращать дополнительные поля для отправки обратно на сервер. Добавьте это к вашему действию чтения на контроллере, и вы можете условно определить, следует ли ему подчиняться.

<script>
function myFunc(){
return {selectedDate: $("#myDatePicker").data("kendoDatePicker").value()};
}</script>

Тогда вызов чтения выглядит так:

.Read(read => read.Action("GetData", "SentDocument", new { Area = GGISWeb.AreaModules.District }).Data("myFunc"))

Затем добавить DateTime? Параметр selectedDate на вашем контроллере.

Ваша сетка имеет возможность собирать всю информацию, необходимую для сбора данных. Вам не нужно беспокоиться об обмене источником данных. Когда ваш указатель даты изменен (или любое другое поле, которое вы можете добавить для критериев сетки), просто вызовите метод dataSource.read () сетки, чтобы получить новые данные.