Sencha 中的树面板复选框
Tree panel check box in Sencha
煎茶树面板复选框出现问题。
如果我选中子节点复选框,我想自动选中父节点的复选框。
目前我需要检查它甚至检查子节点。
下图显示了正在发生的事情..
向包含复选框的列添加侦听器:
columns: [
{
xtype: 'checkcolumn',
listeners: {
checkchange: 'onCheckcolumnCheckChange'
}
},
// ....
]
然后使用这个函数check/uncheck父节点上的check事件
onCheckcolumnCheckChange: function(checkcolumn, rowIndex, checked, eOpts) {
var view = this.getView();
var item = this.getStore().data.items[rowIndex];
var columnName = checkcolumn.dataIndex;
// User unchecked a row: refresh the view
if(!checked){
view.refresh();
return;
}
// User checked a row: unselect all parents
var parentNode = item.parentNode;
while(typeof parentNode != 'undefined' && parentNode !== null && !parentNode.data.root){
parentNode.set(columnName, false);
parentNode = parentNode.parentNode;
}
// Then uncheck all childs (recusif)
(function doChild(children){
if(typeof children == 'undefined' || children === null || children.length <= 0)
return;
for(var i=0; i<children.length; i++){
children[i].set(columnName, false);
doChild(children[i].childNodes); // <= recursivity
}
})(item.childNodes);
view.refresh();
}
煎茶树面板复选框出现问题。 如果我选中子节点复选框,我想自动选中父节点的复选框。 目前我需要检查它甚至检查子节点。
下图显示了正在发生的事情..
向包含复选框的列添加侦听器:
columns: [
{
xtype: 'checkcolumn',
listeners: {
checkchange: 'onCheckcolumnCheckChange'
}
},
// ....
]
然后使用这个函数check/uncheck父节点上的check事件
onCheckcolumnCheckChange: function(checkcolumn, rowIndex, checked, eOpts) {
var view = this.getView();
var item = this.getStore().data.items[rowIndex];
var columnName = checkcolumn.dataIndex;
// User unchecked a row: refresh the view
if(!checked){
view.refresh();
return;
}
// User checked a row: unselect all parents
var parentNode = item.parentNode;
while(typeof parentNode != 'undefined' && parentNode !== null && !parentNode.data.root){
parentNode.set(columnName, false);
parentNode = parentNode.parentNode;
}
// Then uncheck all childs (recusif)
(function doChild(children){
if(typeof children == 'undefined' || children === null || children.length <= 0)
return;
for(var i=0; i<children.length; i++){
children[i].set(columnName, false);
doChild(children[i].childNodes); // <= recursivity
}
})(item.childNodes);
view.refresh();
}