Javascript 在制表器中动态加载子节点
每次树展开时,我都希望从URL加载子节点。但是,由于dataTreeStartExpanded设置为false,并且在每次更新后都会重新绘制表,因此我无法查看子节点,并且只能使用根节点。是否仍要执行此操作?Javascript 在制表器中动态加载子节点,javascript,tabulator,Javascript,Tabulator,每次树展开时,我都希望从URL加载子节点。但是,由于dataTreeStartExpanded设置为false,并且在每次更新后都会重新绘制表,因此我无法查看子节点,并且只能使用根节点。是否仍要执行此操作? 提前谢谢 数据树扩展不是异步的,因此在用户扩展树时无法加载子级,因为在显示子行之前,它不会等待ajax请求返回。此外,仅为首先有子级的行显示展开元素 当数据加载到中时,您需要在表中包含子行。目前,我可以使用Ajax加载子行,但问题是重绘的表不在当前子级,而是在根级,那么,有没有一种方法可以在
提前谢谢 数据树扩展不是异步的,因此在用户扩展树时无法加载子级,因为在显示子行之前,它不会等待ajax请求返回。此外,仅为首先有子级的行显示展开元素
当数据加载到中时,您需要在表中包含子行。目前,我可以使用Ajax加载子行,但问题是重绘的表不在当前子级,而是在根级,那么,有没有一种方法可以在重新绘制表之后保留树的级别?保留树的级别是指保留哪些树被展开或折叠?是的,我希望以您提到的方式保留表。您能为您的代码创建一个JS小提琴或代码笔,以便我能更好地理解什么目前happensIve附加了工作网站,因为代码笔还不支持4.2版本!此外,我还将dataTreeStartExpanded变量设置为true,因此请确保单击展开按钮两次以查看响应!提前谢谢,维德耶什,这能回答你的问题吗?
var table = new Tabulator("#view360-table", {
width:"100%",
dataTree:true,
layout:"fitDataFill",
rowContext:function(e, row){
//e - the click event object
//row - row component
alert(row.getIndex());
},
dataTreeStartExpanded:false,
ajaxURL:"http://localhost/JSONNew/rum.json?v="+Math.floor(Math.random()*100000),
ajaxError:function(xhr, textStatus, errorThrown){
alert("Sorry Error Loading The Table!");
},
dataTreeRowExpanded:function(row, level){
var index= row.getIndex();
$.get("http://localhost/JSONNew/id_"+index+".json", function(data, status){
var obj = JSON.parse(data);
alert(data);
row.update({_children:obj});
},"text");
},
columns:[
{title:"Name", field:"name", width:200, responsive:0},
{title:"Status", field:"status", align:"center",formatter:"tickCross",formatterParams:{allowEmpty:true},width:150, responsive:0},
{title:"Acknowledge", field:"ack", align:"center",formatter:"tickCross",formatterParams:{allowEmpty:true}, width:150, responsive:0},
{title:"Application",columns:[{title:"Application Performance",field:"apperf",formatterParams:{allowEmpty:true} ,align:"center",formatter:"tickCross",width:100,responsive:0}
,{title:"Application Availablity", align:"center",formatter:"tickCross",formatterParams:{allowEmpty:true},field:"appavail",width:100,responsive:0}]},
{title:"Last Status Change",align:"center", field:"statchange", width:200, sorter:"datetime",sorterParams:{allowEmpty:true,format:"DD-MM-YYYY hh.mm AM/PM", alignEmptyValues:"top",},responsive:2},
],
});