Kendo UI Grid Server Side Grouping (без MVC)

Question

Может ли кто-нибудь привести пример данных JSON, который возвращается из службы и потребляется сетью Kendo (чистый JavaScript)? Существует много информации о serverGrouping с использованием их чистых элементов управления Javascript UI ... поэтому мне интересно, получил ли кто-нибудь работу.

Answer 1

Ваша служба может вернуть JSON как это (вы, конечно, может включать в себя столбцы, типы данных и т.д.):

{ 
    groupBy: "Discontinued", 
    rows: [ 
    {ProductName : "Chai",UnitPrice : 18.0000,UnitsInStock : 39,Discontinued : false,}, 
    {ProductName : "Chang",UnitPrice : 19.0000,UnitsInStock : 17,Discontinued : false,}, 
    {ProductName : "Aniseed Syrup",UnitPrice : 10.0000,UnitsInStock : 13,Discontinued : false,}, 
    {ProductName : "Chef Anton's Cajun Seasoning",UnitPrice : 22.0000,UnitsInStock : 53,Discontinued : false,}, 
    {ProductName : "Chef Anton's Gumbo Mix",UnitPrice : 21.3500,UnitsInStock : 0,Discontinued : true,}, 
    {ProductName : "Grandma's Boysenberry Spread",UnitPrice : 25.0000,UnitsInStock : 120,Discontinued : false,} 
    ] 
};  

Тогда ваше определение сетки будет использовать GroupBy в источник данных:

$("#grid").kendoGrid({ 
    dataSource: { 
     data: jsondata.rows, 
     schema: { 
      model: { 
       fields: { 
        ProductName: { type: "string" }, 
        UnitPrice: { type: "number" }, 
        UnitsInStock: { type: "number" }, 
        Discontinued: { type: "boolean" } 
       } 
      } 
     }, 
     group: { 
      field: jsondata.groupBy, 
      dir: "asc" 
     } 
    }, 
    groupable: true, 
    scrollable: true, 
    columns: [ 
     "ProductName", 
     { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "130px" }, 
     { field: "UnitsInStock", title: "Units In Stock", width: "130px" }, 
     { field: "Discontinued", width: "130px" } 
    ] 
}); 

DEMO