Kendo Grid Custom Flter Set过滤器值以编程方式

时间:2017-12-04 15:11:40

标签: kendo-ui telerik kendo-grid kendo-combobox

我正在尝试以编程方式设置Kendo Grid Custom Filter的过滤器值。我正在应用我的新过滤器值,如:

gridOptions.dataSource.filter = [
    {
      field: 'MyField',
      operator: 'eq',
      value: newTextValue
    }
];

网格选项中的字段定义如下:

{
     width: '140px',
     title: 'MyFieldTitle',
     field: 'MyField',
     filterable: getFieldFilter()
}

使用以下过滤器:

function getFieldFilter() {
  return {
    cell: {
      template: function (args) {
        var element = args.element;

        element.kendoComboBox({
          dataSource: {
            transport: {
              read: 'api/Items'
            }
          },
          valuePrimitive: true,
          dataTextField: 'Description',
          dataValueField: 'Code'
        });
      },
      showOperators: false
    }
  };
}

如果我如上所示应用过滤器,它只有在我单击列中的kendoComboBox并再次单击它之外时才有效。 我最初的想法是,剑道网格不会应用dataValueField而只是设置dataTextField。当我检查kendo网格发送到服务器的请求时,我看到它正在发送存储在kendoComboBox本身(文本)中的值而不是它背后的值。

如果我从UI中选择kendoComboBox中的内容,一切正常。但是,如果我像上面那样以编程方式设置它,它就不会。

我是否需要刷新某种状态才能使kendoComboBox刷新其内部值或如何解决此问题?

修改: 我正在尝试做的是从网格中获取kendoCombobox的值。

var currentlyAppliedFilters = grid.dataSource.filter().filters;
for (var filter of currentlyAppliedFilters) {
    if (filter.field === 'MyField') {
      var currentlyApplied = filter.value;
    }
}

所以上面的代码会给我Description中项目的kendoCombobox属性,但我真正想要的是Code属性。

1 个答案:

答案 0 :(得分:0)

最初,当dataSource没有过滤器时,单元过滤器需要一个选项标签。这样第一个值就不会显示为选中状态。

例如:dojo example with optionLabel

 args.element.kendoDropDownList({
                                dataSource: args.dataSource,
                                optionLabel: "Select a color...",
                                dataTextField: "color",
                                dataValueField: "color",
                                valuePrimitive: true
                            });

如果您需要在绑定时过滤网格,则应将默认过滤器添加到dataSource

例如:dojo example with DataSource Filter

 dataSource: { 
          data:[ { color: "#ff0000", size: 30 }, { color: "#000000", size: 33 }] ,
          filter: { field: "color", operator: "eq", value: "#ff0000" }
                    }

希望这有帮助。