filterable.mode String (default: "menu")

If set to row the user would be able to filter via extra row added below the headers. By default filtering is using the menu mode.

Can also be set to the following string values:

  • "row" - the user can filter via extra row within the header.
  • "menu" - the user can filter via the menu after clicking the filter icon.
  • "menu, row" - the user can filter with both modes above enabled.

When the filterable.mode property is set to "row" or "menu, row", the TreeList dataSource instance is copied and applied to the Kendo UI AutoComplete widgets used for string filtering. This will cause one additional read request per string column. The AutoComplete dataSources do not perform paging and will use a collection of the unique column values only.

Example - set mode option to use both "menu" and "row" modes simultaneously

<div id="treeList"></div>

<script>
  $("#treeList").kendoTreeList({
    columns: [
      "lastName",
      "position"
    ],
    filterable: {
        mode: "menu, row"
    },
    dataSource: {
      data: [
        { id: 1, parentId: null, lastName: "Jackson", position: "CEO" },
        { id: 2, parentId: 1, lastName: "Weber", position: "  VP, Engineering" }
      ]
    }
  });
</script>
In this article