树结构

2018-06-27  本文已影响5人  sundern

1.树结构展示

<youi:tree></youi:tree>

必选属性有:没有

id:tree_【展示内容的介绍】

rootText:【根节点展示的文本】

hideRoot:(还没发现有什么作用)

xmenu:【<youi:xmenu>标签的id】

styleClass :col-sm-12 auto-height

iteratorSrc:【树的数据来源:返回List<TreeNode>】

2.树节点右键

除了在<youi:tree>标签中添加xmenu属性外还要单独写<youi:xmenu>标签 以及<youi:func>

<youi:xmenu></youi:xmenu>

必选属性有:后面也暂时不写必须属性,因为自动展示的功能不见了

id:xmenu_【本页内容的介绍】

子元素:<youi:xmenuItem></xmenuItem>

属性:

caption:【右键出的文本】

icon:[右键出的文本的图标](新版平台加为plus)

name:【操作名称,写函数func时用到】

groups:【操作节点的分组,有些树是由不同类型的对象组成的,比如主题指标树,使用groups对节点进行分类】

<youi:func></youi:func>

name:【<youi:tree>标签的id】_xmenu_【<youi:xmenuItem>的name】

3.【应用场景】点击树节点,在页面右侧显示和修改树节点的属性

<youi:func></youi:func>

name:【标签的id】_select

params:treeNodeElem

urls:【主键查询方法】

if(!treeNodeElem.hasClass('root')){

var 变量= treeNodeElem.attr('id');

$elem('【form表单的id】',pageId).form('find',funcUrls.【主键查询方法】+'?【主键】='+变量);

}

4.【应用场景】页面右侧编辑左侧树节点属性,刷新树结构

编辑完指标属性后需要刷新左侧树:

<youi:func name="form_indicator_afterSubmit" params="result">

    if(result&&result.record){

            $.youi.messageUtils.showMessage('保存处室成功.');

            var record = result.record;

            $elem('tree_tj_indicator',pageId).find('#'+record.indicatorId+'>span>a').text(record.indicatorCaption);

        }

</youi:func>

5.【应用场景】节点的文本处理

elem.find('li>span>a').text()

可以抽取为公共方法

function _getTreeNodeText(treeNodeElement) {

return treeNodeElement.find('>span>a').text();

}

6.调整根节点样式去掉多余的"-"

7.已勾选的树的显示

需要将节点存为数组的形式

上一篇 下一篇

猜你喜欢

热点阅读