初始化bootstrap treeview树节点
最近在做启明星图库时,使用了Jquery Bootstrap Treeview插件。但是,遇到了一个初始化的问题。先看效果如下:
当用户打开图库时,左边分类第一个类别是“所有分类”,默认需要选中。

TreeView的数据源来自后台JSON格式,如下:因为分类的数据库格式是ID格式,且是整数自增行。所有,在生成JSON时,会强制在JSON头部增加一个ID为-1的类别,表示“所有分类”
[{"href":"#-1","link":"false","text":"所有类别","c":"1"},{"href":"#1","link":"false","text":"公司活动","c":"1"},{"href":"#2","link":"false","text":"部门活动","c":"1",
"nodes":[{"href":"#3","link":"false","text":"人事部图库","c":"1"},
{"href":"#4","link":"false","text":"财务部图库","c":"1"}]},{"href":"#5","link":"false","text":"其它活动","c":"1"}]
但是,直接把JSON数据源赋值给treeview,第一行并不会默认选中。
最后修改代码如下:
$(document).ready(function ()
{ var aj = $.ajax({
url: 'treejson.aspx?initcatid='+<%=Request.QueryString["catid"]%>,
cache: false,
dataType: 'json',
success: function (datasource) {
$('#tree').treeview({
levels: 2,
data: datasource,
enableLinks: false, onNodeSelected: function (event, key) {
alert("node click"); } }); var id = -1; var treeViewObject = $('#tree').data('treeview'),
allCollapsedNodes = treeViewObject.getCollapsed(),
allExpandedNodes = treeViewObject.getExpanded(),
allNodes = allCollapsedNodes.concat(allExpandedNodes);
for (var i = 0; i < allNodes.length; i++) { if (allNodes[i].href != ("#"+id))
{
continue;
}
var selectNode = allNodes[i];
$('#tree').treeview('revealNode', [selectNode, { silent: true }]);
treeViewObject.selectNode(selectNode);
break;
} } ,
error: function () {
alert("异常!");
}
});
在代码里,增加了初始化选中的ID,例如通过URL传递 catid=2,表示我打开这个网址时,类别ID为2的 部门活动需要被选中 ,效果如下图
请注意代码里的: $('#tree').treeview('revealNode', [selectNode, { silent: true }]); 这句话让树的节点自动展开。例如如果你设置树默认只展开level为1,而你需要展开的节点在2级,
那么'revealNode'将会把该节点自动展开。

初始化bootstrap treeview树节点的更多相关文章
- TreeView 树节点的处理
TreeView 树节点的处理 using System; using System.Collections.Generic; using System.ComponentModel; using S ...
- winform TreeView树节点上下移动
/// <summary> /// 上移 /// </summary> /// <param name="sender"></param& ...
- Access Treeview树节点代码二
Private Sub Form_Load() '引用C:\windows\system32\MSCOMCTL.OCX,否则提示出错. Dim Rec As New ADODB.Recordset D ...
- Access Treeview树节点代码一
Private Sub TreeView0_Updated(Code As Integer)Dim ndeindex As NodeSet ndeindex = TreeView0.Nodes.Add ...
- Bootstrap treeview增加或者删除节点
参考(AddNode: http://blog.csdn.net/qq_25628235/article/details/51719917,deleteNode:http://blog.csdn.ne ...
- Csharp: TreeView 初始化设置默认选择节点
/// <summary> /// 设置查找的节点为选定节点 /// 涂聚文 /// 2013-07-15 /// </summary> /// <param name= ...
- C#上移,下移TreeView中的树节点顺序
C#上移,下移TreeView中的树节点顺序 2009-08-12 20:10 1494人阅读 评论(2) 收藏 举报 c#buttonobjectnullstring C#中,通过单击上移,下移按钮 ...
- 问题-在TreeView使用时,发现选中的树节点会闪烁或消失
问题:在工程中选中一个树节点,鼠标焦点在树上,做某种操作时发现选中的点会消失?原因:如果只是BeginUpdate后,没有调用EndUpdate,树会全空.应该是BeginUpdate方法会刷新树,但 ...
- Qt qml treeview 树控件
qml并没有提供树控件,只能自己写了.model仍然用ListModel对象,弄成层级的就行.delegate必须用loader动态的增加子控件,如此而已. [先看效果] [下载] http://do ...
随机推荐
- Java程序编译和运行过程之 一个对象的生命之旅(类加载和类加载器)
Java程序从创建到运行要经过两个大步骤 1:源文件(.java)由编译器编译成字节码ByteCode(.class) 2:字节码由Java虚拟机解释并运行 源文件编译成字节码,主要分成两个部分: 1 ...
- mariadb-半同步复制
半同步复制: 使用插件 对于从节点,有一部分为同步复制,当主节点复制完从节点后才向客户返回ok,同步超时后自动降级为异步 有一部分为异步复制 这样为了与主节点冗余 基于主从的模式上搭建 半同步复制: ...
- git之一: git基础
参考: SourceTree使用 git教程 廖学风git 文档1 文档2 1. git 概念介绍 工作区: 就是你在电脑里能看到的目录,比如我的learngit文件夹就是一个工作区,工作区下面有. ...
- 2018牛客网暑假ACM多校训练赛(第十场)H Rikka with Ants 类欧几里德算法
原文链接https://www.cnblogs.com/zhouzhendong/p/NowCoder-2018-Summer-Round10-H.html 题目传送门 - https://www.n ...
- js设置元素不能编辑
js设置元素不能编辑 $("#startLocation").attr("readOnly",true); js设置元素可以编辑 $("#startL ...
- .NET Garbage Collection配置在.net core的写法
.net franework<configuration> <runtime> <gcServer enabled="true"/> <g ...
- P1052 过河 线性dp
题目描述 在河上有一座独木桥,一只青蛙想沿着独木桥从河的一侧跳到另一侧.在桥上有一些石子,青蛙很讨厌踩在这些石子上.由于桥的长度和青蛙一次跳过的距离都是正整数,我们可以把独木桥上青蛙可能到达的点看成数 ...
- 在排序数组中查找元素的第一个和最后一个位置(给定一个按照升序排列的整数数组 nums,和一个目标值 target。找出给定目标值在数组中的开始位置和结束位置。)
示例 1: 输入: nums = [5,7,7,8,8,10], target = 8 输出: [3,4] 示例 2: 输入: nums = [5,7,7,8,8,10], target = 6 输出 ...
- hive参数配置及任务优化
一.hive常用参数 0.常用参数 --@Name: --@Description: --@Type:全量加载 --@Author:--- --@CreateDate: --@Target: --@S ...
- 南阳171----聪明的kk
//简单的dp #include<cstdio> #define Max(a,b) ((a)>(b)?(a):(b)) ]; int main() { int i,j,n,m,x,t ...