extjs關(guān)于treePanel+chekBox全部選中以及清空選中問題探討
更新時(shí)間:2013年04月02日 15:13:05 作者:
treePanel+chekBox全部選中以及清空選中,想必大家在學(xué)習(xí)使用過程中都見過這種效果吧,接下來(lái)為大家詳細(xì)介紹下實(shí)現(xiàn)過程及細(xì)節(jié),感興趣的朋友可以參考下哈
復(fù)制代碼 代碼如下:
//樹
var treePanel = new Ext.tree.TreePanel({
id:'ptree',
region:'west',
layout:'anchor',
border:false,
rootVisible: false,
root:{},
listeners:{
render: function() {
authorityTree(treePanel); /*渲染樹*/
},
checkchange: function(node, state) {
if (node.parentNode != null) {
//選中子節(jié)點(diǎn)讓相應(yīng)的父節(jié)點(diǎn)選中
var pNode = node.parentNode;
if (state || treePanel.getChecked(id, pNode) == "") {
pNode.ui.toggleCheck(state);// 觸發(fā)父節(jié)點(diǎn)被選中
pNode.attributes.checked = state;
}
}
treeId = node.attributes.id;
treeName = node.attributes.text;
}
}
});
//操作按鈕
tbar: [{
id: 'btnQingKong',
text: '清空',
iconCls: 'winupdate-icon',
handler: function() {
var nodes = Ext.getCmp('ptree').getChecked();
if (nodes && nodes.length) {
for (var i = 0; i < nodes.length; i++) {
//設(shè)置UI狀態(tài)為未選中狀態(tài)
nodes[i].getUI().toggleCheck(false);
//設(shè)置節(jié)點(diǎn)屬性為未選中狀態(tài)
nodes[i].attributes.checked = false;
}
}
}
},{
id: 'btnQuanXuan',
text: '全選',
iconCls: 'winupdate-icon',
handler: function() {
var nodeT = Ext.getCmp('ptree').getRootNode();
treeCheckTrue(nodeT);
}
}]
/**
*checkTree全選
*/
var treeCheckTrue = function(node)
{
node.eachChild(function (child) {
child.getUI().toggleCheck(true);
child.attributes.checked = true;
treeCheckTrue(child);
});
}
/**
*checkTree清空
*/
var treeCheckfalse = function(tree)
{
var nodes = tree.getChecked();
if(nodes && nodes.length){
for(var i=0;i<nodes.length;i++){
//設(shè)置UI狀態(tài)為未選中狀態(tài)
nodes[i].getUI().toggleCheck(false);
//設(shè)置節(jié)點(diǎn)屬性為未選中狀態(tài)
nodes[i].attributes.checked=false;
}
}
}
相關(guān)文章
解決extjs grid 不隨窗口大小自適應(yīng)的改變問題
在使用grid的時(shí)候窗口改變了但是grid卻不能自適應(yīng),下面有個(gè)不粗的解決方法,大家可以參考下2014-01-01
Extjs grid panel自帶滾動(dòng)條失效的解決方法
對(duì)gridPanel中的stroe數(shù)據(jù)進(jìn)行過濾,所以有時(shí)候總是導(dǎo)致gridPanel自身所帶的scrollbar失效,好了,現(xiàn)在來(lái)說說怎么解決scrollbar失效2014-09-09
extjs 學(xué)習(xí)筆記 四 帶分頁(yè)的grid
很多時(shí)候,我們需要顯示在grid中的數(shù)據(jù)不是短短的幾條或者幾十條,而是成千上萬(wàn)條。如果讓大量的數(shù)據(jù)一股腦全都顯示在一個(gè)頁(yè)面中,可以想象會(huì)造成什么樣的用戶體驗(yàn)。2009-10-10
extJs 文本框后面加上說明文字+下拉列表選中值后觸發(fā)事件
在用extjs做參數(shù)設(shè)置的時(shí)候,想在文本框后加入說明子,在網(wǎng)站上走了一大圈還是沒能找到合適的,小花用了一個(gè)下午的上班時(shí)間終于將這個(gè)頁(yè)面與我想要的功能做出,頁(yè)面很好看與自然,希望網(wǎng)友在用extjs做項(xiàng)目的時(shí)候用的著.2009-11-11
Extjs NumberField后面加單位實(shí)現(xiàn)思路
本文為大家介紹下在NumberField后面加單位,具體實(shí)現(xiàn)如下,感興趣的朋友可以參考下2013-07-07
EXTJS記事本 當(dāng)CompositeField遇上RowEditor
用RowEditor作批量編輯器時(shí),遇到一個(gè)問題,想要在Roweditor中使用三個(gè)下拉列表組成級(jí)聯(lián)式選擇控件2011-07-07
ExtJS下 Ext.Direct加載和提交過程排錯(cuò)小結(jié)
基礎(chǔ)實(shí)一點(diǎn),會(huì)有好處的,排錯(cuò)的時(shí)候就體現(xiàn)出來(lái)了,下面就Ext.Direct做一些排錯(cuò)筆記與大家一一分享,感興趣的朋友可以參考下哈2013-04-04
Ext中下拉列表ComboBox組件store數(shù)據(jù)格式用法介紹
本文為大家詳細(xì)介紹下Ext中下拉列表ComboBox組件store數(shù)據(jù)格式的基本用法,感興趣的朋友可以參考下哈,希望對(duì)大家有所幫助2013-07-07

