easyui中使用tree可以完美的展现树形结构。如下图
html代码如下:
使用cascadeCheck:true为级联选中子节点,默认值为true。
<ul id="resourceTree" class="easyui-tree" data-options="
url:'privilegemgmt/resourceAction_getAll.action',
checkbox:true,
cascadeCheck:true,
multiple:true,
lines:true,
formatter:formatNode,
onLoadSuccess:function(){
<s:if test="role.resources != null">
<s:iterator value="role.resources" id='resource'>
var node = $('#resourceTree').tree('find', <s:property value="#resource.id"/>);
$('#resourceTree').tree('check',node.target)
</s:iterator>
</s:if>
}">
</ul>
这时问题来了,在获取选中的节点时使用tree的getChecked是无法获取到子节点的父节点id的,如上图所示的“子资源”和“测试资源”节点id的。代码如下所示:
var checknodes = $('#resourceTree').tree('getChecked');
需要获取子节点选中时的父节点id可使用以下方法,在getChecked后面加上获取所需选中的指定状态的节点id,代码如下:
var checknodes = $('#resourceTree').tree('getChecked',['checked','indeterminate']);
state值有三个:'checked','unchecked','indeterminate',如果state值未指定,则默认为checked。这样就能获取到子节点的父节点id值。