zTree_v3
zTree_v3 copied to clipboard
编辑名称时 我需要有两个操作来确认编辑 一个是自定义按钮 一个是回车键, 其他操作(比如,点击页面其他区域),不允许退出编辑状态,该如何实现呢? 我尝试监听了键盘事件,发现beforeRename要先于键盘事件执行,我该如何控制呢?
function beforeRename(treeId, treeNode, newName,isCancel){
if(controlSign === 'cancel' || controlSign === 'confirm'){
currentNode = ''
controlSign = ''
return true
}
return false
}
我看到源码中有这样一段
inputObj.bind('blur', function(event) {
if (!view.editNodeBlur) {
view.cancelCurEditNode(setting);
}
}).bind('keydown', function(event) {
if (event.keyCode=="13") {
view.editNodeBlur = true;
view.cancelCurEditNode(setting);
} else if (event.keyCode=="27") {
view.cancelCurEditNode(setting, null, true);
}
}).bind('click', function(event) {
return false;
}).bind('dblclick', function(event) {
return false;
});
首先要说,都 2021年了,对于 input 来说,很多都是 blur 就直接取消编辑状态了。。。
当然,我也不能说你的要求不对,但目前的源码肯定无法支持,要么你直接修改 zTree 源码,要么你利用 beforeEditName 阻止 zTree 的编辑事件,然后你自己那边去实现一套修改名称的交互界面。
首先要说,都2021年了,对于输入来说,很多都是模糊的就直接取消编辑状态了。。。
当然,我也不能说你的要求不对,但现在的直接源码无法支持,还有你需要修改的zTree源码,还有你之前利用编辑名称阻止zTree的编辑事件,然后你自己去实现自定义修改名称的交互界面。
我现在是通过在input上强行加一个事件,去触发了两次rename的回调 解决了这个问题
const keyUpFn = event =>{
if (event.keyCode=="13") {
const zTree = $.fn.zTree.getZTreeObj("treeDemo")
confirmClick(event.data.treeNode)
}
}
...
$(`#${treeNode.tId}_input`).unbind('keyup', keyUpFn)
$(`#${treeNode.tId}_input`).bind('keyup',{treeNode}, keyUpFn)