Question

＆＃13;

var data;
var gridColumns;
var grid;
var showlist;
var viewModel;

viewModel = kendo.observable({
  showlist:false,

});

kendo.bind($(checklist), viewModel);

function onChange() {
    viewModel = kendo.observable({
      showlist:true, 
    });
filterinfo(cType.value());
kendo.bind($(checklist), viewModel);
  }

function filterinfo(value)
{
  var treeView = $("#treeview").data("kendoTreeView");
  if(treeView){
    treeView.destroy();
    $("#treeview").html("");
  }

  switch(value){
    case "1":
      treeView = $("#treeview").kendoTreeView({
          checkboxes   : {
            checkChildren: false,
            template     : $("#template").html()
          },
          dataSource   : PrimaryProbe,
          dataTextField: "value"
        }).data("kendoTreeView");
      
      function checkedNodeIds(nodes, checkedNodes) {
    //console.log(nodes);
    for (var i = 0; i < nodes.length; i++) {
        if (nodes[i].checked) {
            checkedNodes.push(nodes[i].id);
        }
        if (nodes[i].hasChildren) {
            checkedNodeIds(nodes[i].children.view(), checkedNodes);
        }
    }
}

// show checked node IDs on datasource change
treeView.dataSource.bind("change", function () {
    var message;
    var checkedNodes = [];

    checkedNodeIds(treeView.dataSource.view(), checkedNodes);
    if (checkedNodes.length > 0) {
        message = "IDs of checked nodes: " + checkedNodes.join(",");
    } else {
        message = "No nodes checked.";
    }
    $("#result").html(message);
});
      
      
      
      break;
    case "2":
      treeView = $("#treeview").kendoTreeView({
          checkboxes   : {
            checkChildren: false,
            template     : $("#template").html()
          },
          dataSource   : Probe,
          dataTextField: "value"
        }).data("kendoTreeView");
      
      function checkedNodeIds(nodes, checkedNodes) {
    //console.log(nodes);
    for (var i = 0; i < nodes.length; i++) {
        if (nodes[i].checked) {
            checkedNodes.push(nodes[i].id);
        }
        if (nodes[i].hasChildren) {
            checkedNodeIds(nodes[i].children.view(), checkedNodes);
        }
    }
}

// show checked node IDs on datasource change
treeView.dataSource.bind("change", function () {
    var message;
    var checkedNodes = [];

    checkedNodeIds(treeView.dataSource.view(), checkedNodes);
    if (checkedNodes.length > 0) {
        message = "IDs of checked nodes: " + checkedNodes.join(",");
    } else {
        message = "No nodes checked.";
    }
    $("#result").html(message);
});
      break;
  }
}

var clientType = [{"clientTypeID":1,"clientTypeName":"PrimaryProbe"},
                  {"clientTypeID":2,"clientTypeName":"Probe"}]


var cType = $("#clientType").kendoComboBox({
                        filter: "contains",
                        change: onChange,
                        placeholder: "Filter by client type",
                        dataTextField: "clientTypeName",
                        dataValueField: "clientTypeID",
                        dataSource: {
                            data:clientType
                        }
                    }).data("kendoComboBox");




var Probe = new kendo.data.HierarchicalDataSource({
  data: [
    { id      : 1,
     parent_id: 0,
     value    : "General Information - Probe",
     expanded : true,
     items    : [
       { id: 11, parent_id: 1, value: "CPU Model"},
       { id: 12, parent_id: 1, value: "CPU Usage" },
       { id: 13, parent_id: 1, value: "Free Space"},
       { id: 14, parent_id: 1, value: "Hardware Model"},
       { id: 15, parent_id: 1, value: "Master/Slave Mode"},
       { id: 16, parent_id: 1, value: "Memory Usage" },
       { id: 17, parent_id: 1, value: "Product Version" },
       { id: 18, parent_id: 1, value: "Software Version" }
     ]},
    { id      : 2,
     parent_id: 0,
     value    : "Sim Pool Information - Probe",
     expanded : true,
     items    : [
       { id: 21, parent_id: 2, value: "Slot 1"},
       { id: 22, parent_id: 2, value: "Slot 2"},
       { id: 23, parent_id: 2, value: "Slot 3"},
       { id: 24, parent_id: 2, value: "Slot 4"},
       { id: 25, parent_id: 2, value: "Slot 5"},
       { id: 26, parent_id: 2, value: "Slot 6"},
       { id: 27, parent_id: 2, value: "Slot 7"},
       { id: 28, parent_id: 2, value: "Slot 8"}
     ]},
    {
      id       : 3,
      parent_id: 0,
      value    : "Trace Files Information - Probe",
      expanded : true,
      items    : [
        { id: 31,parent_id: 3, value: "FTP Upload Status"},
        { id: 32,parent_id: 3, value: "Remaining Agent Trace Files" },
        { id: 33,parent_id: 3, value: "Remaining Probe Trace Files" },
        { id: 34,parent_id: 3, value: "Remaining TRP Log Files"}
      ]
    }
  ]
});
var PrimaryProbe = new kendo.data.HierarchicalDataSource({
  data: [
    { id      : 5,
     parent_id: 0,
     value    : "General - Primary Probe",
     expanded : true,
     items    : [
       { id: 51, parent_id: 5, value: "Agent Running Mode"},
       { id: 52, parent_id: 5, value: "Agent Version"},
       { id: 53, parent_id: 5, value: "Master/Slave Mode"},
       { id: 54, parent_id: 5, value: "Manufacturer"},
       { id: 55, parent_id: 5, value: "Model"},
       { id: 56, parent_id: 5, value: "Software Version"}
     ]}
  ]
});





// function that gathers IDs of checked nodes


function add(){  
  viewModel = kendo.observable({
  showlist:true,

});
kendo.bind($(checklist), viewModel);

  
}
function check(){ 

}

＆＃13;

#fieldlist {
                   margin: 0;
                   padding: 0;
               }
       
               #fieldlist li {
                   list-style: none;
                   padding-bottom: 1.5em;
                   text-align: left;
               }
       
               #fieldlist label {
                   display: block;
                   padding-bottom: .3em;
                   font-weight: bold;
                   text-transform: uppercase;
                   font-size: 12px;
               }

.searchClientText {
    width: 222px !important;
    height: 25px !important;
    border-radius: 3px;
}

.checkboxList {
  margin: 0 0 -1em;
  padding: 0;
}

.checkboxList li {
  list-style: none;
  padding-bottom: 1em;
}

td {
  width:150px;
    vertical-align: top;
}

＆＃13;

<!DOCTYPE html>
<html>
<head>
 <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.2.607/styles/kendo.common.min.css"/>
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.2.607/styles/kendo.silver.min.css"/>
     <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://kendo.cdn.telerik.com/2016.3.914/js/kendo.all.min.js"></script>

    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://kendo.cdn.telerik.com/2016.2.607/js/kendo.all.min.js"></script>

<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <div class="demo-section k-content">
    
    <ul id="fieldlist">
      <li>
        <input id="clientType" style="width:auto" />
      </li>
    </ul>
  </div>
  
  <script id="template" type="text/kendo-ui-template">
    # if(!item.hasChildren){ #
    <input type='hidden' id='#= item.id #' parent_id='#= item.parent_id #' d_text='#= item.value #'/>
    <input type='checkbox' id_a='#= item.id #' name='c_#= item.id #' value='true'/>
    #}else{#
    <div id='#= item.id #' style='display:none;' parent_id='#= item.parent_id #' d_text='#= item.value #'/>
    #}#
</script>
  <div id="checklist" data-bind="visible: showlist">
    <table>
      <tr>
        <td><div id="treeview"></div><div id="result"></div></td>
      </tr>
    </table>
  </div>



  

</body>
</html>

＆＃13;

将会有一个带有[＆＃34; Primary Probe＆＃34;，＆＃34; Probe＆＃34;]的组合框，一旦我从组合框中选择一个选项，将显示一个复选框列表和一次选中复选框，然后它将获得id并显示在结果中。

问题：问题是当我将选项从主探针更改为探针或探针到组合框的主探针时，它将取消选中我选择的组合框。

如何使系统加载我的已检查ID

Answer 1

在filterinfo中创建的新TreeView实例没有附加到其dataSource的change处理程序。对于第一个TreeView实例，目前只执行一次，这就是为此实例显示已检查ID的原因。

未根据存储的id

1 个答案: