我们公司的需求是根据状态值 展开所有的父节点
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link href="css/bootstrap.3.3.7.css" rel="stylesheet">
<link href="css/bootstrap-theme.css" rel="stylesheet">
<link href="css/bootstrap-table.css" rel="stylesheet">
<link href="css/jquery.treegrid.min.css" rel="stylesheet">
<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
<script type="text/javascript" src="js/bootstrap3.3.7.min.js"></script>
<script type="text/javascript" src="js/bootstrap-table.js"></script>
<script type="text/javascript" src="js/bootstrap-table-zh-CN.js"></script>
<script type="text/javascript" src="js/bootstrap-table-treegrid.js"></script>
<script type="text/javascript" src="js/jquery.treegrid.min.js"></script>
<script>
$(function () {
var $table = $("#table");
$table.bootstrapTable({
url:'url/bootstrap_treegrid.json',
striped:true,
sidePagenation:'server',
idField:'id',
columns:[
{
field:'name',
title:'名称'
},{
field:'referred',
title:'简称'
}
],
treeShowField: 'name',
parentIdField: 'pid',
onLoadSuccess: function(data) {
$table.treegrid({
initialState: 'collapsed',//收缩b
treeColumn: 0,//指明第几列数据改为树形
expanderExpandedClass: 'glyphicon glyphicon-triangle-bottom',
expanderCollapsedClass: 'glyphicon glyphicon-triangle-right',
onChange: function() {
$table.bootstrapTable('resetWidth');
}
});
// Find all nodes
$.each(data, function (i, val) {
if(data[i].name=='新增系统'){
var expandNode= $('.treegrid-'+data[i].id);
//$table.treegrid('getRootNodes').treegrid('expand');
//递归所有的父节点 将还有父节点的展开
expandParentNode(expandNode);
//console.log( $table.treegrid('getRootNodes').treegrid('getNodeId'));
}
})
// $('#node-1').treegrid('getChildNodes').treegrid('expand');
}
});
//先判断值 是否是符合条件的 1.如果符合 获取父节点 展开父节点 2如果还有父节点展开所有父节点 展开所有的父节点
//var tableTree=$('#table').treegrid('getRootNodes');
//console.log(tableTree);
//var tables= $('.treegrid-1').treegrid('getParentNode').treegrid('expanded');
;
//console.log(tables);
//$table.treegrid('getParentNode').treegrid('collapse');
// $table.treegrid('expandRecursive');
//$table.bootstrapTable('expandRow', 2);
})
function expandParentNode(parentNode){
//var expandParentNode= $('.treegrid-'+data[i].id);
if(parentNode.treegrid('getParentNode')!=null){
parentNode.treegrid('getParentNode').treegrid('expand');
}
var parentNodeId= parentNode.treegrid('getParentNodeId');
if(parentNodeId!=null){
var expandNode= $('.treegrid-'+parentNodeId);
expandParentNode(expandNode);
}
}
</script>
</head>
<body>
<table id="table"></table>
</body>
</html>
所有此插件方法参考 http://www.fly63.com/article/detial/5952