当我尝试使用ig-tree api开发树结构时,我遇到了一个问题。
当我第一次将命令拖到树结构时它工作正常。删除并尝试添加命令后,它不遵循必须遵循的结构。
以下附件是拖动时的实际结构。
enter image description here
从树中删除节点并尝试拖动新节点后,它不遵循结构并显示如下。
enter image description here
可以请你帮我解决我的问题。
var count = -1;var cmdcount;
var textexecount = 0;
var tt =-1;
var t1 = 0,c1=0;
var f,g=0,h=0;
var k;var i =0;var a=[];
var obj = null;
var data = [];
var dum =0;
var z,h;
var selection;
//var dup1=0,d = "";
var data1 = [];
var stand = new Date();
stand = "test_"+stand;
//Bind
$(document).delegate("#firstTree", "igtreenodedropped", function (evt, ui) {
//return reference to the binding.
ui.binding;
//return reference to the data.
ui.data;
//return reference to the draggable element (the node).
ui.draggable
//return reference to the element.
ui.element;
//return reference to the helper.
ui.helper;
//return reference to the offset.
ui.offest;
//return to get a reference to the original position of the draggable element (the node).
ui.orginalPosition
//return reference to the node path.
ui.path
//return reference to the current position of the draggable element.
ui.position
});
$("#firstTree").igTree({
singleBranchExpand: true,
dataSource: $.extend(true, [], cmd),
dataSourceType: 'json',
initialExpandDepth: 0,
pathSeparator: '.',
bindings: {
textKey: 'Text',
valueKey: 'Value',
imageUrlKey: 'ImageUrl',
childDataProperty: 'Folder'
},
dragAndDrop: true,
dragStop:function(evt ,ui){ }
});
$(function () {
$("#secondTree").igTree({
singleBranchExpand: true,
dataSource: $.extend(true, [], Test),
dataSourceType: 'json',
initialExpandDepth: 0,
pathSeparator: '.',
bindings: {
textKey: 'Text',
valueKey: 'Value',
imageUrlKey: 'ImageUrl',
childDataProperty: 'Folder'
},
dragAndDrop: true,
nodeDropping:function(evt,ui){
/*dup1 = ui.draggable.first().text();
console.log(d);
if (d.indexOf(dup1)){
alert("single copy");
}else{
alert("duplicate copy");
dragAndDropMode : false;
//dragAndDrop : false;
} */
},
nodeDropped: function(evt,ui){
z = ui.data.Text;
z = z.slice(-1);
if(ui.data.Text == stand){
tt = tt+1;
a[tt] =dum;
dum =0;
textexecount = 0;
count = count+1;
$("#secondTree").igTree("addNode", {
"Text": "testexe"+t1,
"Folder": [{
"Text": "Commandexe"+c1,
"Folder":[{
"Text": ui.draggable.first().text()
}]
}]
},ui.element);
var sum = "0."+count;
//alert(sum);
$("#secondTree").igTree("removeAt" , sum);
testexe = "testexe"+t1;
commandexe = "commandexe"+c1;
t1 = t1+1;
c1 = c1+1;
h = testexe.slice(-1);
k = ui.element;
i = i+1;
}else if(ui.data.Text == testexe){
textexecount = textexecount+1;
// console.log(ui.element[0].outerText);
$("#secondTree").igTree("addNode", {
"Text": "Commandexe"+c1,
"Folder":[{
"Text": ui.draggable.first().text()
}]
},ui.element);
dum = dum+1;
//console.log(dum);
var sum = "0."+tt+"."+textexecount;
//alert(c1);
$("#secondTree").igTree("removeAt" , sum);
commandexe = "Commandexe"+c1;
c1 = c1+1;
}else if((ui.data.Text == "Commandexe") && (ui.data.Text == commandexe)){
}else if(z < h){
var ne = ui.data.Text ;
f =ne.slice(-1);
var b = Number(f)
var p = (b+1);
$("#secondTree").igTree("addNode", {
"Text": "Commandexe"+c1,
"Folder":[{
"Text": ui.draggable.first().text()
}]
},ui.element);
a[p] =a[p]+1;
var o = a[p];
//alert(o);
sum = "0."+f+"."+o;
$("#secondTree").igTree("removeAt" , sum);//0.0.1
c1 = c1+1;
}
obj = $("#secondTree").igTree( "children", k );
d = $('#secondTree a:last-child').text();
},
dragAndDropSettings: {
allowDrop: true,
dragAndDropMode: 'copy',
customDropValidation: function (element) {
// Validates the drop target
var valid = true,
droppableNode = $(this);
if (droppableNode.is('a') && droppableNode.closest('li[data-role=node]').attr('data-value') === 'File') {
valid = false;
}
return valid;
}
}
});
});
//node dropped
$(document).delegate("#secondTree", "igtreenodedropping", function (evt, ui) {
//return reference to the binding.
ui.binding;
//return reference to the data.
ui.data;
//return reference to the draggable element (the node).
ui.draggable
//return reference to the element.
ui.element;
//return reference to the helper.
ui.helper;
//return reference to the offset.
ui.offest;
//return to get a reference to the original position of the draggable element (the node).
ui.path
//return reference to the current position of the draggable element.
ui.position
});
// deleting
$("#secondTree").on("igtreeselectionchanged", function (e, ui) {
selection = ui.selectedNodes[0].path;
$("#btnRemoveNode").click(function (e) {
$("#secondTree").igTree("removeAt" , selection);
obj = $("#secondTree").igTree( "children", k );
//fun();
});
});
// for first tree
/* $("#firstTree").on("igtreeselectionchanged", function (e, ui) {
dup1 = ui.newNodes[0].data.Text;
}); */
function fun(){
//console.log(obj);
data = [];
angular.forEach(obj, function(value, key){
var cmdexe = [];
angular.forEach(value.data.Folder, function(value1, key1){
var cmd = [];
angular.forEach(value1.Folder, function(value2, key2){
cmd.push({"cmdName": value2.Text});
});
cmdexe.push({"commandExecutorName": value1.Text, "commandExecutorCommandVOList": cmd});
});
data.push({"taskExecutorName": value.data.Text, "commandExecutorVOList": cmdexe});
});
console.log(Jstrong textSON.stringify(data));
}
</script>