时间戳

首页 > 解决方案 > Kendo UI TreeView 复选框 全选

javascript - Kendo UI TreeView 复选框 全选

问题描述

我有类似的情况，例如这个DEMO。

  1. 当我点击表格顶部的“全选”时，它会在 kendoTreeView 上检查下面所有具有不同 ID 名称的复选框？
  2. 为什么我无法检查父节点。例如，如果检查名称“ Steven Buchanan ”，则所有孩子都是检查。

道场演示

标签： javascriptkendo-uikendo-treeview

解决方案

我已经找到了答案。

  1. 我需要在“全选”复选框上创建 onchange 函数。来源在这里
 <input type="checkbox" id="chbAll" value="Uncheck" class="k-checkbox" onchange="chbAllCheck()" />

function chbAllCheck() {
  var checkButtonValue = $("#chbAll").val();

  if(checkButtonValue == "Uncheck"){
    $("#treeview .k-checkbox-wrapper input").prop("checked", true).trigger("change");
    $("#treeview_1 .k-checkbox-wrapper input").prop("checked", true).trigger("change");
    $("#treeview_2 .k-checkbox-wrapper input").prop("checked", true).trigger("change");
    $("#chbAll").val("Check");
  } else {
    $("#treeview .k-checkbox-wrapper input").prop("checked", false).trigger("change");
    $("#treeview_1 .k-checkbox-wrapper input").prop("checked", false).trigger("change");
    $("#treeview_2 .k-checkbox-wrapper input").prop("checked", false).trigger("change")
    $("#chbAll").val("Uncheck");
  }
}
  1. 需要更换这条线checkboxes: { checkChildren: true },。来源在这里

这是一个工作演示，以防有人需要

推荐阅读