Question

我正在尝试使用复选框设置treeview，并且默认选中了一些复选框，这里是我的数据源值： -

[{"id":12,"Name":"Shirts","hasChildren":false,"Checked":true}
,{"id":13,"Name":"Jeans","hasChildren":false,"Checked":false},
{"id":14,"Name":"Shoes","hasChildren":false,"Checked":true},
{"id":15,"Name":"Apparel accessories","hasChildren":false,"Checked":false}]

和我的观看页面代码： -

                       $(document).ready(function() {
                        $("#category-treeview").kendoTreeView({
                            dataSource: categories,
                            dataTextField: "Name",
                            checkboxes: true
                    });
                });

但我没有选中复选框为什么？

有任何建议可以解决这个问题吗？

此致 VINIT

Answer 1

您的代码基本上是正确的。唯一的问题是Checked需要checked（小写）。您的数据如下：

var categories = [
    {"id":12,"Name":"Shirts","hasChildren":false,"checked":true},
    {"id":13,"Name":"Jeans","hasChildren":false,"checked":false},
    {"id":14,"Name":"Shoes","hasChildren":false,"checked":true},
    {"id":15,"Name":"Apparel accessories","hasChildren":false,"checked":false}
];

我在这里将您的代码改为：http://jsfiddle.net/OnaBai/78k2b/

Answer 2

如果你需要做的只是显示是否选中了复选框，你可以轻松地使用templateFunction作为复选框。

checkboxes: {
    template: checkboxTemplate
}

并使用类似

的功能

function checkboxTemplate(e) {
  if(e.item.Checked) {
    return "<input type='checkbox' checked='checked' />";
  } 
  else {
    return "<input type='checkbox' />";
  }
}

这种方法的问题是，没有双向数据绑定发生。因此，如果您更改复选框并转储dataSource，则不会反映该更改。

如果您需要双向数据绑定，那么您可以将更改发回，您将需要使用更复杂的东西。在这篇SO帖子中Binding checkboxes in treeview with checkboxes that uses remote datasource）很好地列出了它。

我已经找到了一个更优雅的答案，因为它看起来相当普遍，但还没有找到任何东西。

如何在树视图中选中默认设置复选框

2 个答案: