【问题标题】:Remove operator dropdown from Kendo grid filter menu从 Kendo 网格过滤器菜单中删除操作员下拉菜单
【发布时间】:2013-09-21 03:19:07
【问题描述】:

如何从 Kendo 网格过滤器菜单中删除操作员下拉菜单?我在下面有一个下拉列表,其中包含供用户选择的值,因此在上面有一个框表示等于是毫无意义的。

【问题讨论】:

    标签: jquery html kendo-ui kendo-grid


    【解决方案1】:

    剑道论坛已经回答了这个问题: Kendo forum - Use dropdownlist in grid column filter

    在其他地方之前总是在那里搜索是很好的。 基本上你得到了标题过滤器并隐藏了下拉菜单。 我冒昧地修改了论坛中的小提琴,因为查找标题 jquery 选择器有点“cucoo”。你可以使用普通的剑道配置而不是手动创建组合

    filterable: {
        ui: function(){ ... }
    }
    

    主要是隐藏和修改帮助。

    // Find the Role filter menu.
    var filterMenu = _grid.thead.find("th[data-field='roleTitle']").data("kendoFilterMenu");
    
    filterMenu.form.find("div.k-filter-help-text").text("Select an item from the list:");
    filterMenu.form.find("span.k-dropdown:first").css("display", "none");
    

    在这里找到它: JSFiddle - Dropdown filter in kendo grid

    【讨论】:

    • 嗨@regisbsb。我尝试使用您的解决方案,但我采取“无法获取未定义或空引用的属性'查找'”异常。你能帮我解决这个异常吗?
    • 您能详细说明一下吗?你见过小提琴吗?它对我有用。
    • 我修好了。我忘记了,但我认为这是关于事件的。 FilterMenu 一开始没有完全加载。这就是属性“查找”未定义的原因。感谢您的回复@regisbsb
    【解决方案2】:

    我是通过在构建 UI 时声明一个要调用的函数来实现的。这应该比四处寻找课程要容易得多。

    {
       field: "Status",
       title: "Status",
       filterable: {
          extra: false,
          ui: statusFilter
       }
    }
    
    
    function statusFilter(element) {
    
        // finds the closest form so we can start manipulating things.
        var form = element.closest("form");  
    
        // changes the help text. (you might want to localise this)
        form.find(".k-filter-help-text:first").text("Select an item from the list:");
    
        // removes the dropdown list containing the operators (contains etc)
        form.find("select").remove();
    
        // Adds a new dropdownlist with all the options you want to select from
        element.kendoDropDownList({ ...... });
    
    }
    

    【讨论】:

      【解决方案3】:

      将事件添加到网格

      .Events(e => e.FilterMenuInit("FilterMenuFunc"))
      

      然后是一个java脚本函数

       function FilterMenuFunc(e) {
              var grid = $("#GridName").data("kendoGrid");
              var filterMenu = $(grid.thead.find("th:not(.k-hierarchy-cell,.k-group-cell)")[5]).data("kendoFilterMenu");//5 is index of column
              try {
                  filterMenu.form.find("div.k-filter-help-text").text("Please Select A Value From List.");
                  filterMenu.form.find("span.k-dropdown:first").css("display", "none");
              } catch (e) {}
      
          }
      

      【讨论】:

        猜你喜欢
        • 2019-05-13
        • 1970-01-01
        • 1970-01-01
        • 2023-03-25
        • 1970-01-01
        • 2017-02-23
        • 1970-01-01
        • 1970-01-01
        • 2013-06-22
        相关资源
        最近更新 更多