Question

我已经看到了很多关于排序的问题，但是对于我这个非常简单的案例，我找不到任何问题。

我已经上线了example（如果我添加了可排序和可过滤的，他们也不会在类别字段上工作），并且稍微修改它，只是为了使用非常简单的本地json数据（以便在学习网格时更清楚地了解我正在使用的内容。

所以，看看我要排序和过滤的类别字段，在我的列定义中我有....

 columns: [
  {
    ...
  {
    field: "Category",
    title: "Category",
    width: "180px",        
    editor: categoryDropDownEditor,
    template: "#=Category.description#"
  },

并且在数据源中，category字段包含简单的json对象，其中包含2个字段代码和描述（其中代码为value字段，描述为显示内容）...

var gridData = [
{
....
ProductID : 1,
ProductName : "Chai",
Category : {
    code : '1',
    description : "Beverages",

 },
...
];

我已将可排序和可过滤的属性添加到网格中，但类别字段显示排序箭头（单击时切换），但列数据不排序或过滤。

如何进行排序和过滤以查看描述字段以执行这些操作？

注意我还附加了一个组合单元格编辑器

function createCombo(container, options, data) {
  var input = $('<input name="' + options.field + '" />')
  input.appendTo(container)
  var combobox = input.kendoComboBox({
    autoBind: true,
    filter: "contains",
    placeholder: "select...",
    suggest: true,
    dataTextField: "description",
    dataValueField: "code",
    dataSource: data,
  });

数据的格式为

[ 
  {code: 'code1', description: 'desc1'},
  {code: 'code2', description: 'desc2'},
]

所以我需要组合也用正确的值填充字段。

提前感谢您的帮助！

Answer 1

  <script>

    var gridData = [
{
    ProductID: 1,
    ProductName: "Chai",
    Category: {
        code: '1',
        description: "beverages",

    }
},
 {
     ProductID: 1,
     ProductName: "bhai",
     Category: {
         code: '1',
         description: "aceverages",

     }
 },
  {
      ProductID: 1,
      ProductName: "dhai",
      Category: {
          code: '1',
          description: "zeverages",

      }
  }
    ];

    $(document).ready(function () {
        $("#grid").kendoGrid({
            dataSource: gridData,
            height: 550,
            groupable: true,
            sortable: true,
            pageable: {
                refresh: true,
                pageSizes: true,
                buttonCount: 5
            },
            columns: [{
                field: "ProductID",
                title: "Contact Name",
                width: 200
            }, {
                field: "ProductName",
                title: "Contact Title"
            }, {
                field: "Category.description",
                title: "Category",
                width: "180px",
                template: "#=Category.description#"
            }]
        });
    });
</script>

Kendo Grid：如何对绑定到简单json对象的列进行排序（和过滤）

1 个答案: