filterMenuInit

Fires when the TreeList filter menu is initialized. The event handler function context (available through the this keyword) will be set to the widget instance.

Event Data

e.container jQuery

The jQuery object which represents the filter menu form element.

e.field String

The field of the column for which the filter menu is initialized.

e.sender kendo.ui.TreeList

The widget instance which fired the event.

Example - subscribing to the filterMenuInit event during initialization

<div id="treeList"></div>
<script>
  $("#treeList").kendoTreeList({
    columns: [
      { field: "id" },
      { field: "name" },
      { field: "age" }
    ],
    dataSource: [
      { id: 1, parentId: null, name: "Jane Doe", age: 22, expanded: true },
      { id: 2, parentId: 1, name: "John Doe", age: 24 },
      { id: 3, parentId: 1, name: "Jenny Doe", age: 3 }
    ],
    filterable: true,
    filterMenuInit: function(e) {
      if (e.field == "name") {
        var firstValueDropDown = e.container.find("select:eq(0)").data("kendoDropDownList");
        firstValueDropDown.value("contains");
        firstValueDropDown.trigger("change");

        var logicDropDown = e.container.find("select:eq(1)").data("kendoDropDownList");
        logicDropDown.value("or");
        logicDropDown.trigger("change");

        var secondValueDropDown = e.container.find("select:eq(2)").data("kendoDropDownList");
        secondValueDropDown.value("contains");
        secondValueDropDown.trigger("change");
      }
    }
  });
</script>

Example - subscribing to the filterMenuInit event during initialization and changing the default operators

<div id="treelist"></div>
<script>
  function treelist_filterMenuInit(e) {
    if (e.field == "name") {
      var firstValueDropDown = e.container.find("select:eq(0)").data("kendoDropDownList");
      firstValueDropDown.value("contains");
      var logicDropDown = e.container.find("select:eq(1)").data("kendoDropDownList");
      logicDropDown.value("or");
      var secondValueDropDown = e.container.find("select:eq(2)").data("kendoDropDownList");
      secondValueDropDown.value("contains");
    }
  }
  $("#treelist").kendoTreeList({
    columns: [
      { field: "id" },
      { field: "name" },
      { field: "age" }
    ],
    dataSource: [
      { id: 1, parentId: null, name: "Jane Doe", age: 22, expanded: true },
      { id: 2, parentId: 1, name: "John Doe", age: 24 },
      { id: 3, parentId: 1, name: "Jenny Doe", age: 3 }
    ],
    filterable: true
  });
  var treelist = $("#treelist").data("kendoTreeList");
  treelist.bind("filterMenuInit", treelist_filterMenuInit);
</script>