jquery miniui treeselect ，asp.net

项目中遇到一个问题，就是下拉框选择treegrid。网上查了资料，觉得juqery miniui的treeselect还不错。分享给大家。

1.去官网下载jquery miniui。我下的是.net版本的。

2.只要把scripts这个文件夹放到项目里面就行了

3.在页面添加代码

<input id="trerselect" name="trerselect" class="mini-treeselect" url="User/GetUserTreeList" multiselect="true"  
 textfield="text" valuefield="id" parentfield="pid" checkrecursive="true" showfoldercheckbox="true" expandοnlοad="true" showclose="true" 

oncloseclick="onCloseClick"  popupwidth="200" />  

这里的

url就对应后台方法的路径，

textfiled 要显示的文本，

valuefield 文本值，

parentfield 父ID

multiselect 多选，

showfoldercheckbox 显示父级选择框，

expandonload 加载后展开，

showclose 显示"X"，

onCloseClick  "X" 的事件，用来清空选择的内容

4.javascript

<script type="text/javascript">  
 function onCloseClick(e) {  
            var obj = e.sender;  
            obj.setText("");  
            obj.setValue("");  
        }  
 function getValue() {  
            var obj = mini.get("treeslect");  
            return obj.getValue();  
        }  
</script> 

5.后台方法,返回json类型的数据就可以了。数据格式如下

[
{id: "1", text: "系统管理", tag: "xitongguanli"},
{id: "2", text: "日志管理", pid: "1", tag: "rizhiguanli"},
{id: "3", text: "字典管理", pid: "1", tag: "zidianguanli"},
{id: "4", text: "部门管理", pid: "1", tag: "bumenguanli"},
{id: "5", text: "权限管理", tag: "quanxianguanli"},
{id: "6", text: "用户管理", pid: "5", tag: "yonghuguanli"},
{id: "7", text: "角色管理", pid: "5", tag: "jueseguanli"}
]

然后就可以运行了。