我必须使用树结构来显示来自Java的数据。我正在使用jQuery的treetable插件,我无法获得我想要的输出。这是我的代码。
Freemarker :
<table id="dt_basic" class="table table table-bordered table-hover" width="100%">
<thead>
<tr>
<#list rows.getCols() as col>
<th>${col.getColumnName()}</th>
</#list>
</tr>
</thead>
<tbody>
<#list rows.getRows() as row>
<#if !parent??>
<#assign parent = row />
<tr data-tt-id="${parent[rows.getCols()[0].getColumnName()]}" data-tt-branch="true">
<td>${parent[rows.getCols()[0].getColumnName()]}</td>
<td colspan="${rows.getCols()?size-1}"></td>
</tr>
<#elseif row[rows.getCols()[0].getColumnName()] != parent[rows.getCols()[0].getColumnName()]>
<#assign parent = row />
<tr data-tt-id="${parent[rows.getCols()[0].getColumnName()]}">
<td>${row[col.getColumnName()]}</td>
<td colspan="${rows.getCols()?size-1}"></td>
</tr>
</#if>
<tr data-tt-id="1.1" data-tt-parent-id="${row[rows.getCols()[0].getColumnName()]}">
<#list rows.getCols() as col>
<#if col?is_first>
<td>${row[col.getColumnName()]}</td>
<#else>
<#if col.isRightAligned()>
<td name="${col.getColumnName()}" align='RIGHT'>${row[col.getColumnName()]}</td>
<#else>
<td name="${col.getColumnName()}">${row[col.getColumnName()]}</td>
</#if>
</#if>
</#list>
</tr>
</#list>
</tbody>
</table>
的jQuery
$("#dt_basic").treetable({
expandable: true,
clickableNodeNames: true,
onNodeExpand: function() {
$.when( this.show() ).done( function () {
$("#dt_basic").resizableColumns('syncHandleWidths');
});
},
onNodeCollapse: function() {
$("#dt_basic").resizableColumns('syncHandleWidths');
}
});
$("#dt_basic").wrap( "<div class='tableWrap'></div>" );
我遇到的问题非常不同:
首先,当我创建$("#dt_basic").treetable
时,我收到错误:
未捕获的TypeError:无法读取未定义“
的属性”addChild“
另一个问题是我无法以我想要的方式显示视图。它看起来应该是这样的:
Node - > All node's childs
New Node -> All new node's childs
但我得到了:
Node - > Child
Node - > Child
New Node - > New node child
New Node - > New node child