ztree jquery 树 控件
插件地址:http://www.ztree.me
数据:[{"id":1,"pId":-1,"name":"根目录"},{"id":2,"pId":1,"name":"子目录1"}]
<ul id="tree" class="ztree" style="padding: 0px 0px;"></ul>
$.ajax({
method: 'get',
url: 'api/ZTree/Get',
contentType: "application/json; charset=utf-8",
success: function (data) {
$.fn.zTree.init($("#tree"), {
view: {
showIcon: true,
showLine: true,
showTitle: true
},
data: {
simpleData: {
enable: true,
idKey: "id",
pIdKey: "pId",
rootPId:-1
},
key: {
title: "Info"
}
},
callback: {
onClick: function (event,treeId,treeNode,clickFlag) {
console.log(treeNode)
}
}
}, eval(data));
}
});
var cid = $.request.queryString["mid"];
if (cid != null) {
var treeObj = $.fn.zTree.getZTreeObj("tree_Doc");
var node = treeObj.getNodeByParam("id", cid, null);
if (node != null) {
treeObj.selectNode(node);
}
}
$.request = (function () {
var apiMap = {};
function request(queryStr) {
var api = {};
if (apiMap[queryStr]) { return apiMap[queryStr]; }
api.queryString = (function () {
var urlParams = {};
var e,
d = function (s) { return decodeURIComponent(s.replace(/\+/g, " ")); },
q = queryStr.substring(queryStr.indexOf('?') + 1),
r = /([^&=]+)=?([^&]*)/g;
while (e = r.exec(q)) urlParams[d(e[1])] = d(e[2]);
return urlParams;
})();
api.getUrl = function () {
var url = queryStr.substring(0, queryStr.indexOf('?') + 1);
for (var p in api.queryString) { url += p + '=' + api.queryString[p] + "&"; }
if (url.lastIndexOf('&') == url.length - 1) { return url.substring(0, url.lastIndexOf('&')); }
return url;
}
apiMap[queryStr] = api;
return api;
}
$.extend(request, request(window.location.href));
return request;
})();$.request
ztree jquery 树 控件的更多相关文章
- Jquery树控件ZTree异步加载
异步加载的意思就是: 当点击展开树节点时,才去请求后台action返回点击节点的子节点数据并加载. 这里面主要设计ztree的setting变量的async属性设置: var setting = { ...
- 转:zTree树控件扩展篇:巧用zTree控件实现文本框输入关键词自动模糊查找zTree树节点实现模糊匹配下拉选择效果
是否可以借助于zTree实现文本框输入关键词自动模糊匹配zTree下拉树,然后选择下拉树内节点显示在文本框内且隐藏下拉树. 看到这个需求脑子里头大致已经想到了要如何实现这样一个需求,当时是限于时间问题 ...
- jQuery树形控件zTree使用小结
作者:Fonour 字体:[增加 减小] 类型:转载 时间:2016-08-02我要评论 这篇文章主要为大家详细介绍了jQuery树形控件zTree使用方法,zTree树插件的基本使用方法,感兴趣的小 ...
- jQuery树形控件zTree使用
http://www.cnblogs.com/AutumnRhyme/p/5915769.html .................................................. ...
- 转:zTree树控件实战篇:针对多个下拉加载zTree树应该如何做出合理的配置
今天有一个zTree的朋友遇到一个非常棘手的问题,才研究zTree树控件两天就被上头催着看成果,很是苦恼.他面对的问题就是页面内多个地方需要下拉在其文本框下方加载zTree树,由于对zTree下拉加载 ...
- JS组件系列——Bootstrap 树控件使用经验分享
前言:很多时候我们在项目中需要用到树,有些树仅仅是展示层级关系,有些树是为了展示和编辑层级关系,还有些树是为了选中项然后其他地方调用选中项.不管怎么样,树控件都是很多项目里面不可或缺的组件之一.今天, ...
- 基于MVC4+EasyUI的Web开发框架经验总结(2)- 使用EasyUI的树控件构建Web界面
最近花了不少时间在重构和进一步提炼我的Web开发框架上,力求在用户体验和界面设计方面,和Winform开发框架保持一致,而在Web上,我主要采用EasyUI的前端界面处理技术,走MVC的技术路线,在重 ...
- js插件---Bootstrap 树控件
js插件---Bootstrap 树控件 一.总结 一句话总结:可以直接用gojs,或者搜索js,jquery的树控件,或者bootstrap树控件,一大堆 gojs 二.JS组件系列——Bootst ...
- Bootstrap树控件(Tree控件组件)使用经验分享
前言:很多时候我们在项目中需要用到树,有些树仅仅是展示层级关系,有些树是为了展示和编辑层级关系,还有些树是为了选中项然后其他地方调用选中项.不管怎么样,树控件都是很多项目里面不可或缺的组件之一.今天, ...
随机推荐
- 在Xcode5下实现4.5,4.6的效果
https://www.evernote.com/shard/s227/sh/a575caee-d6a8-4f43-9037-145b9a6913ca/c9a2befa22ce7c3f547f58 ...
- 【洛谷 P1651】 塔 (差值DP)
题目链接 题意:\(n\)个木块放到两个塔里,每个木块可放可不放,使得两塔高度相同且高度最大,求最大高度. 这个差值\(DP\)的思维难度还是很大的,没想出来,我就打了一个\(dfs\)骗了好像\(2 ...
- RedHat修改系统时区
http://blog.itpub.net/27099995/viewspace-1370723/ 今天又被开发的说服务器时间异常,时差很大.我就纳闷了,上个星期都调整过的.去查看了一下. [root ...
- iOS 动画整理
序列帧动画 曾经项目里的一段源码: 1234567891011121314 UIImageView * activityImageView = [[UIImageView alloc] init];N ...
- 自建yum镜像
#!/usr/bin/python #-*- coding: utf-8 -*- import requests import sys,logging,traceback from bs4 impor ...
- SSH的简单入门体验(Struts2.1+Spring3.1+Hibernate4.1)- 查询系统(下)
我们继续吧,SSH最大的优点就是实现的系统的松耦合,能够将后台和前台有机的分离开来. 一.目录结构 一个好的程序要有一个好的开始.我们先来看看整个目录结构吧 主要的是三层架构概念,或者说是mvc的概念 ...
- 生产环境安装centos时的磁盘规划
一般来说,分区要按照公司领导的要求来执行.但是如果没有要求,一般按照下面的方法进行磁盘规划. /boot分区200M: swap分区分内存的2倍.如果内存大于等于8G,那么swap分8G即可: /分区 ...
- Solidity 文档--第二章:安装 Solidity
安装Solidity 基于浏览器的Solidity 如果你只是想尝试一个使用Solidity的小合约,你不需要安装任何东西,只要访问基于浏览器的Solidity. 如果你想离线使用,你可以保存页面到本 ...
- Centos 7.3 安装 Mongodb
通过yum 安装: yum install -y mongodb-server Mongodb操作命令: #启动 systemctl start mongod.service #关闭 systemct ...
- lua返回服务器信息
ngx.header.content_type = "text/plain"; ngx.say(tostring(ngx.var.request_uri));ngx.say(tos ...