jeesite的treeselect使用总结

场景1

在选择了一个选项后，要根据这个选项值去后台加载更多的内容到页面

解决思路

1.onchange监听输入框值变化，js出发方法ajax去取数据

2.treeselect这个js里面设置回调函数，选择后回调

本人采用回调方法实现：

treeselect.tag里面代码如下：

<%@ tag language="java" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<%@ attribute name="id" type="java.lang.String" required="true" description="编号"%>
<%@ attribute name="name" type="java.lang.String" required="true" description="隐藏域名称（ID）"%>
<%@ attribute name="value" type="java.lang.String" required="true" description="隐藏域值（ID）"%>
<%@ attribute name="labelName" type="java.lang.String" required="true" description="输入框名称（Name）"%>
<%@ attribute name="labelValue" type="java.lang.String" required="true" description="输入框值（Name）"%>
<%@ attribute name="title" type="java.lang.String" required="true" description="选择框标题"%>
<%@ attribute name="url" type="java.lang.String" required="true" description="树结构数据地址"%>
<%@ attribute name="checked" type="java.lang.Boolean" required="false" description="是否显示复选框，如果不需要返回父节点，请设置notAllowSelectParent为true"%>
<%@ attribute name="extId" type="java.lang.String" required="false" description="排除掉的编号（不能选择的编号）"%>
<%@ attribute name="isAll" type="java.lang.Boolean" required="false" description="是否列出全部数据，设置true则不进行数据权限过滤（目前仅对Office有效）"%>
<%@ attribute name="notAllowSelectRoot" type="java.lang.Boolean" required="false" description="不允许选择根节点"%>
<%@ attribute name="notAllowSelectParent" type="java.lang.Boolean" required="false" description="不允许选择父节点"%>
<%@ attribute name="module" type="java.lang.String" required="false" description="过滤栏目模型（只显示指定模型，仅针对CMS的Category树）"%>
<%@ attribute name="selectScopeModule" type="java.lang.Boolean" required="false" description="选择范围内的模型（控制不能选择公共模型，不能选择本栏目外的模型）（仅针对CMS的Category树）"%>
<%@ attribute name="allowClear" type="java.lang.Boolean" required="false" description="是否允许清除"%>
<%@ attribute name="allowInput" type="java.lang.Boolean" required="false" description="文本框可填写"%>
<%@ attribute name="cssClass" type="java.lang.String" required="false" description="css样式"%>
<%@ attribute name="cssStyle" type="java.lang.String" required="false" description="css样式"%>
<%@ attribute name="smallBtn" type="java.lang.Boolean" required="false" description="缩小按钮显示"%>
<%@ attribute name="hideBtn" type="java.lang.Boolean" required="false" description="是否显示按钮"%>
<%@ attribute name="disabled" type="java.lang.String" required="false" description="是否限制选择，如果限制，设置为disabled"%>
<%@ attribute name="dataMsgRequired" type="java.lang.String" required="false" description=""%>
<%@ attribute name="callbackFlag" type="java.lang.Boolean" required="false" description=""%>
<%@ attribute name="urlRefreshFlag" type="java.lang.Boolean" required="false" description=""%>


	
	    

在里面加了一个属性<%@ attribute name="callbackFlag" type="java.lang.Boolean" required="false" description=""%>

设置完值后回调函数：

$("#${id}Id").val(ids.join(",").replace(/u_/ig,""));
                    $("#${id}Name").val(names.join(","));
                    if("${callbackFlag}" == "true"){
                        callback(ids.join(",").replace(/u_/ig,""), names.join(","));// 回调自定义函数
                    }

使用时：

                        name="baseDeatilDtoList[0].productId" value="" labelName=""
                        labelValue="" title="基础模块" allowInput="true"
                        notAllowSelectParent="true" callbackFlag="true" checked="true"
                        notAllowSelectRoot="true" url="/product/categoryProduct/treeData"
                        cssClass="" />

这种开关式的设计结构灵活，易于扩展，思路值得借鉴