【非常實用】EXTJS TREE 上下級級聯選擇擴展方法
當父節點的複選框被選中時,其子節點要自動級聯全被選中,當父節點的一個子節點被選中時,其對應的父節點也要被級聯選中
//判斷是否有子結點被選中
var childHasChecked = function(node) {
var childNodes = node.childNodes;
if(childNodes || childNodes.length>0){
for(var i=0;i<childNodes.length;i++){
if(childNodes[i].getUI().checkbox.checked)
return true;
}
}
return false;
};
//級聯選中父節點
var parentCheck = function(node ,checked){
var checkbox = node.getUI().checkbox;
if(typeof checkbox == 'undefined')
return false;
if(!(checked ^ checkbox.checked))
return false;
if(!checked && childHasChecked(node))
return false;
checkbox.checked = checked;
node.attributes.checked = checked;
node.getUI().checkbox.indeterminate = checked; //半選中狀態
node.getOwnerTree().fireEvent('check', node, checked);
var parentNode = node.parentNode;
if( parentNode !== null){
parentCheck(parentNode,checked);
}
};
//增加checkchange監聽
tree.on('checkchange', function(node, checked) {
var parentNode = node.parentNode;
if(parentNode !== null) {
parentCheck(parentNode,checked);
}
node.expand();
node.attributes.checked = checked;
node.eachChild(function(child)
{
child.ui.toggleCheck(checked);
//判斷是否有子結點被選中
var childHasChecked = function(node) {
var childNodes = node.childNodes;
if(childNodes || childNodes.length>0){
for(var i=0;i<childNodes.length;i++){
if(childNodes[i].getUI().checkbox.checked)
return true;
}
}
return false;
};
//級聯選中父節點
var parentCheck = function(node ,checked){
var checkbox = node.getUI().checkbox;
if(typeof checkbox == 'undefined')
return false;
if(!(checked ^ checkbox.checked))
return false;
if(!checked && childHasChecked(node))
return false;
checkbox.checked = checked;
node.attributes.checked = checked;
node.getUI().checkbox.indeterminate = checked; //半選中狀態
node.getOwnerTree().fireEvent('check', node, checked);
var parentNode = node.parentNode;
if( parentNode !== null){
parentCheck(parentNode,checked);
}
};
//增加checkchange監聽
tree.on('checkchange', function(node, checked) {
var parentNode = node.parentNode;
if(parentNode !== null) {
parentCheck(parentNode,checked);
}
node.expand();
node.attributes.checked = checked;
node.eachChild(function(child)
{
child.ui.toggleCheck(checked);
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.