无法以编程方式检查 Kendo 网格的多 select 复选框过滤器

Question

我正在尝试以编程方式检查 Kendo 网格的多 select 复选框的复选框，虽然这是设置输入标签属性值的简单功能，但似乎并不为我工作。

我试过以下方法

1.<input type='checkbox' checked='checked'/>
2. <input type='checkbox' checked='true'/>
3. <input type='checkbox' checked/>
4. $(".k-multicheck-wrap >div >input").attr("checked", "checked");
5. $(".k-multicheck-wrap >div >input").attr("checked", "true");

None 这些选项似乎在网格列的过滤器控件中起作用。但是如果我在这个控件之外创建一个复选框它确实有效

Here is the code I am trying to work on

请帮我解决这个问题。提前致谢！

Answer 1

它是这样工作的，因为及时，当你试图检查那些复选框时 - 它们还不存在。它们是在用户单击过滤器图标后创建的。

因此，filterMenuInit 事件在过滤器创建后触发。你可以在那里做你的逻辑。

注意：如果用户单击过滤器图标，将始终触发该事件。它只会被调用一次——在初始化之后。并且将为用户打开过滤器选项的每一列调用它。

这里是demo如何使用它。

$(document).ready(function(){
       $("#grid").kendoGrid({
        columns: [ {
            field: "country",
            filterable: {
                multi:true,
                itemTemplate: function(e) {
                   
                      return "<div><input type='checkbox' data-text='#= data.country #' /><span>#= data.country|| data.all #</span></div>"
                    
                }
            }
        }],
        filterable: true,
        filterMenuInit: function(e){
          if(e.field == "country")
        {
            //$(".k-multicheck-wrap >div >input").prop("checked", true)
            $(".k-multicheck-wrap >div >input[type=checkbox][data-text='BG']").prop("checked", true)
        }
        },
      
        dataSource: [ { country: "BG" }, { country: "USA" } ]
    });
  });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2019.1.220/js/kendo.all.min.js"></script>

 <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.common.min.css"/>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.rtl.min.css"/>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.silver.min.css"/>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.mobile.all.min.css"/>
    
    <div id="grid"></div>

无法以编程方式检查 Kendo 网格的多 select 复选框过滤器

Unable to check the multi-select checkbox filter of the Kendo Grid Programmatically

javascript

jquery

kendo-ui

kendo-grid

kendo-multiselect