请教关于jstree展开节点加载子节点问题

请教关于jstree展开节点加载子节点问题,第1张

jstree默认打开有两种方式,一种在生成树结构时在有子节点的li中加class="jstree-open"还有一种是树形载入完成后用jstree的所有节点open_all事件所有节点跳转是要在生成时在li中加XXX或在载入完后再用js加载

var UITree = function () {

var contextualMenuSample = function() {

$.jstree.destroy ("#tree_3")

$('#tree_3').jstree({

"core" : {

"themes": {

"responsive": false

},

"check_callback": true,

"force_text": true,

"cache": false,

'state':open,

'data': {

"url": function() {

return "/authority/showOnlyTheme"

},

"data":function(node){

return {"id" : node.id}

}

}

},

"plugins": [ "contextmenu", "ui"]

/*'contextmenu':{

'items':{

'edit':null

}

}*/

}).bind("loaded.jstree", function () {

jQuery("#tree_3").jstree("open_all")

}).bind("create_node.jstree",function(event,data){

createCategory(event,data)

}).bind("rename_node.jstree",function(event,data){

rename(event,data)

}).bind("delete_node.jstree",function(event,data){

reMove(event,data)

})

}

return {

init: function () {

contextualMenuSample()

}

}

function createCategory(event,data){

var str = data.parent

var parentId = str.substring(1)

if(!str.match(/^c\d+/g)){

parentId = -1

}

var newNodeName = data.node.text

var params = {"parentId":parentId,"name":newNodeName,"rootId":parentId}

$.ajax({

'url':"/categoryManager/addOrUpdate",

'type':"post",

'dataType':'json',

'cache':false,

'data':params,

'timeout':1000*10

}).done(function(json){

var id = data.node.id

var categoryId = json.data

$(data.node).attr("id",categoryId)//此处修改成后台返回的id

}).fail(function(e){

Metronic.unblockUI()

alert("亲出错了,请稍后再试")

})

}

function rename(event,data) {

var str = data.node.id

if(str.match("#")) {

alert("不能修改根节点")

return

}

var id = str.substring(1)

var name = data.text

var params = {"id":id,"name":name}

$.ajax({

'url':'/categoryManager/updateName',

'type':'post',

'dataType':'json',

'data':params,

'cache':false,

'timeout':1000*10

}).fail(function(){

Metronic.unblockUI()

alert("亲出错了,请稍后再试~")

})

}

function reMove(event,data) {

var str = data.node.id

if(str.match("#")) {

alert("亲,不能删除根节点")

return

}

var id = str.substring(1)

var params = {"id":id}

$.ajax({

'url':"/categoryManager/del",

'type':"post",

'dataType':"json",

'data':params,

'cache':false,

'timeout':1000*10

}).done(function(json){

if(json.ret==false) {

alert(json.errmsg)

}

}).fail(function(json){

Metronic.unblockUI()

alert("亲出错了,请稍后再试~")

})

}

}()

一个带有右键 *** 作的树形菜单

$(document).ready(function(){

$.ajaxSetup({cache:false})

$("#browser").tree({

data : {

type : "json",

url : src,

async : true,

async_data : function (NODE) {

return { parent_Id : $(NODE).attr("id") || 0}

}

},

lang:{

loading:"目录加载中……"

},

rules:

{

draggable : "all" //这个设置可以使得节点进行拖动 *** 作

},

ui:{

context : [ //自定义右键 *** 作的可 *** 作内容

{

id : "create",

label : "添加下级目录", //右键d出菜单的此项 *** 作屏显字样

visible : function (NODE, TREE_OBJ) { if(NODE.length != 1) return falsereturn TREE_OBJ.check("creatable", NODE)}, //允许节点被右击时出现 *** 作菜单

icon: "<%=request.getContextPath() %>/css/themes/default/create.png",//右键d出菜单的此项 *** 作图标

action : function (NODE, TREE_OBJ) {

//进行此项 *** 作,将有这个函数事件被响应

}

},

"separator"//这个是在两个 *** 作之间画一条分隔线

,

{

id : "edit",

label : "编辑目录信息",

visible : function (NODE, TREE_OBJ) { if(NODE.length != 1) return falsereturn TREE_OBJ.check("creatable", NODE)},

icon: "<%=request.getContextPath() %>/image/reg2.gif",

action : function (NODE, TREE_OBJ) {

openWindow('myurl','','',function(){treeRefresh($(NODE).attr("id"))})

}

},

"separator"

,

{

id : "privilege",

label : "设置目录权限",

visible : function (NODE, TREE_OBJ) { if(NODE.length != 1) return falsereturn TREE_OBJ.check("creatable", NODE)},

icon: "<%=request.getContextPath() %>/css/themes/default/rename.png",

action : function (NODE, TREE_OBJ) {

openWindow('myurl','','',function(){treeRefresh($(NODE).attr("id"))})

}

},

"separator",

{

id : "delete",

label : "删除",

visible : function (NODE, TREE_OBJ) { if(NODE.length != 1) return falsereturn TREE_OBJ.check("creatable", NODE)},

icon: "<%=request.getContextPath() %>/css/themes/default/remove.png",

action : function (NODE, TREE_OBJ) {

var tree=$.tree_reference("browser")

openWindow('myurl','','',function(){

//下边的.parent()和.refresh()均为v0.9.8版本提供,如果你使用的是其他版本如v0.9.6等,这些将不被支持。

NODE=$(tree.parent(NODE))

if($(NODE).attr("id")==undefined){

tree.refresh()

}else{

TreeRefresh()

}

})

}

},

"separator",

{

id : "others",

label : "其他 *** 作",

visible : function (NODE, TREE_OBJ) { if(NODE.length != 1) return falsereturn TREE_OBJ.check("creatable", NODE)},

icon: "<%=request.getContextPath() %>/css/images/cut.png",

action : function (NODE, TREE_OBJ) {

alert("暂无可提供 *** 作。")

}

}

]

},

callback : {

onselect: function(node) {

//(a)

}

}

})

function treeRefresh(nodeid){

var rid=nodeid

var tree=$.tree_reference("browser")

var par_node=tree.parent($("#"+rid))

tree.refresh(par_node)

}

})


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11238053.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-14
下一篇 2023-05-14

发表评论

登录后才能评论

评论列表(0条)

保存