/**
* 选中节点,因为tree是异步加载,所以必须在success回调中调用checkNode函数,否则无法获取生成的DOM元素
* @param filter lay-filter属性
* @param id 选中的id
*/
TreeSelect.prototype.checkNode = function(filter, id){
var o = obj.filter(filter),
treeInput = o.find('.layui-select-title input'),
treeObj = obj.treeObj(filter),
node = treeObj.getNodeByParam("id", id, null),
name = node.name;
treeInput.val(name);
o.find('a[treenode_a]').removeClass('curSelectedNode');
treeObj.selectNode(node);
};
问题出在treeObj = obj.treeObj(filter) 根本选不到该控件,这个地方treeObj无对象返回,不知道Layui是怎么回事,demo是没问题的,到我的项目中就出问题了。有可能版本不对吧
问题找到了,只能解决。下面贴出我解决的代码
<div class="layui-inline layui-col-md4">
<label class="layui-form-label bg-blue">实施人员</label>
<div class="layui-input-block" >
<input type="text" class="layui-input" lay-filter="tree" id="tree"/>
</div>
</div>
layui.use(["treeSelect"], function () {
var treeSelect = layui.treeSelect;
treeSelect.render({
// 选择器
elem: '#tree',
// 数据
data: 'project/getMemberList.do',
// 异步加载方式:get/post,默认get
type: 'get',
// 是否开启搜索功能:true/false,默认false
search: true,
// 一些可定制的样式
style: {
folder: {
enable: true
},
line: {
enable: true
}
},
// 点击回调
click: function(d){
console.log(d);
},
// 加载完成后的回调函数
success: function (d) {
console.log(d);
// 选中节点,根据id筛选
treeSelect.checkNode('tree', ${data.id},d.treeId);
}
});
treeSelect.checkNode('tree', ${data.id},d.treeId);在这我加了个传参d.treeId
下面再看我treeSelect.js的修改部分
/**
* 选中节点,因为tree是异步加载,所以必须在success回调中调用checkNode函数,否则无法获取生成的DOM元素
* @param filter lay-filter属性
* @param id 选中的id
*/
TreeSelect.prototype.checkNode = function(filter, id,treeId){
var newTreeId = treeId.replace('layui-treeSelect','layui-treeSelect-body');
var inputId = treeId.replace('layui-treeSelect','treeSelect-input');
var treeObj = $.fn.zTree.getZTreeObj(newTreeId);
var node = treeObj.getNodeByParam("id", id, null);
var treeInput = $("#"+inputId);
treeInput.val(node.name);
treeObj.selectNode(node);
};
这是我采用投机的办法,曲线救国。其他的方法我就没去改了,这样可以选中节点。