easyUI中tree的簡單使用


一、在JS中的代碼

$('#tt').tree({
url: baseCtx + 'lib/easyui-1.4/demo/tree/tree_data1.json',//tree數據的來源,json格式的數據
method: 'get',
animate: true,
checkbox: true,//有復選框
// cascadeCheck:false,

//選中的事件
onSelect: function(node) {
if(node.checked) {
$(this).tree("uncheck", node.target);//把指定節點設置為未選中
} else {
var cknodes = $(this).tree("getChecked");
for(var i = 0; i < cknodes.length; i++) {
$(this).tree("uncheck", cknodes[i].target);//把指定節點設置為未選中
}
//再選中改節點
$(this).tree("check", node.target);//把指定節點設置為選中

//預留ajax
}
},

//右擊彈出的菜單
onContextMenu: function(e, node) {
e.preventDefault();//阻止自帶的右擊菜單
$(this).tree('select', node.target);
$('#mm').menu('show', {
left: e.pageX,
top: e.pageY
});
},

//點擊時候的事件
onClick: function(node){
var nodes = $('#tt').tree('getChecked'); // get checked nodes
var nodes1 = $('#tt').tree('getChecked', 'unchecked'); // get unchecked nodes
var nodes2 = $('#tt').tree('getChecked', 'indeterminate'); // get indeterminate nodes
var nodes3 = $('#tt').tree('getChecked', ['checked','indeterminate']); // get checked and ind

alert(nodes1);
//alert(node.text); // alert node text property when clicked
}
});

//追加子節點的方法

function append() {
var textName = "";
$.messager.prompt('輸入框', '請輸入要添加的部門/組的名稱', function(r) {
if(r) {
textName = r;
var t = $('#tt');
var node = t.tree('getSelected');
t.tree('append', {
parent: (node ? node.target : null),
data: [{
text: textName
}]
});
}
});
}

//刪除節點的方法

function removeit() {
var node = $('#tt').tree('getSelected');
$('#tt').tree('remove', node.target);
}


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM