Question

我有一个剑道网格，其数据类型为boolean。我使用过滤器模式“行”。

我使用combobox作为过滤器，如下所示：

filterable: {
  cell: {
    template: function (args) {
      args.element.kendoComboBox({

        valuePrimitive: true,
        dataSource: [
          { text: "No", value: "false" },
          { text: "Yes", value: "true" },
          { text: "All", value: "all" }
        ],
        dataTextField: "text",
        dataValueField: "value"
      });

    },
    operator: "eq",
    showOperators: false
  }
}

dojo示例：http://dojo.telerik.com/@lgoubet/uGeYIXoG

我不想使用

filterable: {
    messages:
    {
      isTrue: "Oui",
      isFalse: "Non"
    }
}

我想使用一个复选框或单选按钮，因为它更漂亮并且更合适。

您有样品吗？有想法吗？

Answer 1

您可以对任何所需元素使用自定义过滤器。元素的onChange事件触发过滤器：

这里是一个例子：

 $('#yourRadio').change(function (ev) {
        var grid = $('#grid').data('kendoGrid');
        var field = 'Locked';
        var operator = 'contains';
        var value = this.value;
        grid.dataSource.filter({
            field: field,
            operator: operator,
            value: value
        });
    });

您还可以使用CSS停用删除网格顶部的过滤器的功能。

th [role="listbox"] {
    visibility: hidden;
}   
thead {
    visibility: hidden;
    display: none;
}

Answer 2

Kendo提供了一个自动布尔过滤器，您只需在数据源schema中指定“锁定”是布尔值即可：

$("#grid").kendoGrid({
      dataSource: {
        data: data,
        schema: {
            model: {
            fields: {
              locked: {
                type: "boolean"
              },
              name: {}
            }
          }
        }
      }
   ...});

此处提供了完整示例：http://dojo.telerik.com/aGOvOYiT

现在，该过滤器是否是您想要的（它是两个单选按钮），它比一个Kendo问题更是一个UX问题。我建议不要使用一个复选框，因为不清楚未选中状态是“未过滤”还是“被错误过滤”。您的组合框是一个不错的解决方案，因为它具有3个清晰明确的状态。

带有布尔值的Kendo网格过滤器模式行

2 个答案: