使用 Ajax 結果填充 Kendo 網格

Question

我希望能夠使用 ajax 調用的結果來決定我將填充哪個 Kendo Grid。 如果我只收到數組中的一個項目，我想填充一個網格，否則我有另一個用於多個項目的網格。

我的 jQuery

    $.ajax({
        type: "POST",
        dataType: "json",
        url: 'Item/GetItems/',
        data: { number: number },
        success: function (data) {

            if (data.length == 1) {
                var sGrid = $("#SingleGrid").data("kendoGrid").dataSource.data(data);

                //I´ve also tried this
                //sGrid.refresh();
            }
            else {
                var mGrid = $("#MultipleGrid").data("kendoGrid").dataSource.data(data);

                //I´ve also tried this
                //mGrid .refresh();
            }
        },
        error: function () {
        }
    });

我的控制器動作

    public ActionResult GetItems([DataSourceRequest] DataSourceRequest request, string number)
    {
        var items = _idg.GetItems(number);
        return Json(items.ToDataSourceResult(request, ModelState));
    }

我一直在監視 Firebug，它沒有顯示任何錯誤。 我試圖通過決定填充其中一個網格來阻止對服務器的第二次調用。 有沒有辦法像這個客戶端一樣強制刷新數據源？ （不調用 dataSource 上的 read 函數，這將第二次調用服務器）

######已編輯########

function TestGrid() {
    var dataSource = new kendo.data.DataSource({
        transport: {
            read: {
                type: "POST",
                dataType: "json",
                url: 'Item/GetItems/'
            }
        },
        schema: {
            data: function (response) {
                // Here the Total is always correct
                return response.Total;
            }
        }
    });

    dataSource.fetch(function () {
        var kendoGrid;
        var data = this.data();
        //Here the data does not include my Total
        alert(data);
        if (data.length == 1) {
            kendoGrid = $("#SingleGrid").data("kendoGrid");
        } else {
            kendoGrid = $("#MultipleGrid").data("kendoGrid");
        }
        kendoGrid.setDataSource(dataSource);
        kendoGrid.refresh();
    });
}

從上面的示例中，我似乎無法從 this.data() 中得出總數。 當我使用 Firebug 進行調試時，我可以看到總數始終是正確的。 有任何想法嗎？

Answer 1

您可以填充 kendo 數據源的新實例，加載數據，然后對結果進行操作，設置網格的數據源。 也許是這樣的：

var dataSource = new kendo.data.DataSource({
  transport: {
    read:  {
      type: "POST",
      dataType: "json",
      url: 'Item/GetItems/',
      data: { number: number },
    }
  }
});

然后從服務器獲取數據並處理結果：

dataSource.fetch(function() {
  var data = this.data();
  var kendoGrid;
  if (data.length == 1) {
    kendoGrid = $("#SingleGrid").data("kendoGrid");
  } else {
    kendoGrid = $("#MultipleGrid").data("kendoGrid");
  }
  // Replace the grids data source with our new populated data source
  kendoGrid.setDataSource(dataSource);
  kendoGrid.refresh();
});

Answer 2

你也可以做這些事情。

$("#grid").kendoGrid({
            dataSource: {
                transport: {
                    read: {
                        url: "http://localhost:13073/home/KendoGriddata",
                        dataType: "json",
                        type: "Post",
                        data: function () {
                            var dt = { MultipleSearchText: 'rikin' };
                            return dt;
                        }
                    }
                },
                pageSize: 5    
            });

Answer 3

您可以嘗試這樣的變體：

var grid = $('#SingleGrid').getKendoGrid(); 
grid.dataSource.data(data);
grid.refresh();