bootstrap的treeview组件
程序员文章站
2022-06-08 15:08:50
...
1.引入文件
3.创建js
5.创建获取json对象的方法
<link href="bootstrap-treeview-1.2.0/css/bootstrap-treeview.min.css" title="" rel="stylesheet"/>
<script src="bootstrap-treeview-1.2.0/js/bootstrap-treeview.min.js" type="text/javascript"></script>
2.创建标签
<div id="tree"></div>
3.创建js
function getTree() {
$.ajax({
type: "post",
url: "/common/getTreeNodes",
dataType: "json",
success: function (data) {
var tree = [
{
text: "总行",
id: "00000000",
href: "#node-1",
selectable: true,
state: {
checked: true,
expanded: true,
selected: true
},
nodes: data
}
];
$('#tree').treeview(
{
data: tree,
levels: 2,
backColor: '#FFF',
onNodeSelected: function (event, data) {
// Your logic goes here
console.log(data.id);
},
}
);
}
});
}
getTree();
4.创建类
public class TreeNodesDTO implements Serializable {
private String id;
private String text;
private String upper;
private Integer grade;
private List<TreeNodesDTO> nodes;
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getText() {
return text;
}
public void setText(String text) {
this.text = text;
}
public String getUpper() {
return upper;
}
public void setUpper(String upper) {
this.upper = upper;
}
public Integer getGrade() {
return grade;
}
public void setGrade(Integer grade) {
this.grade = grade;
}
public List<TreeNodesDTO> getNodes() {
return nodes;
}
public void setNodes(List<TreeNodesDTO> nodes) {
this.nodes = nodes;
}
}
5.创建获取json对象的方法
@Controller
@RequestMapping("/common")
public class TreeNodesController {
@Autowired
private TreeNodesMapper treeNodesMapper;
@RequestMapping("/getTreeNodes")
@ResponseBody
private Object getTreeNodes() {
List<TreeNodesDTO> treeNodesDTO2 = new ArrayList<TreeNodesDTO>();
List<TreeNodesDTO> treeNodesDTO3 = new ArrayList<TreeNodesDTO>();
List<TreeNodesDTO> treeNodesDTO4 = new ArrayList<TreeNodesDTO>();
List<TreeNodesDTO> treeNodesDTO5 = new ArrayList<TreeNodesDTO>();
List<TreeNodesDTO> treeNodesDTO = treeNodesMapper.selectAll();
for (TreeNodesDTO nodesDTO : treeNodesDTO) {
switch (nodesDTO.getGrade()) {
case 2:
treeNodesDTO2.add(nodesDTO);
break;
case 3:
treeNodesDTO3.add(nodesDTO);
break;
case 4:
treeNodesDTO4.add(nodesDTO);
break;
case 5:
treeNodesDTO5.add(nodesDTO);
break;
}
}
for (TreeNodesDTO nodesDTO : treeNodesDTO4) {
List<TreeNodesDTO> temp = new ArrayList<TreeNodesDTO>();
for (TreeNodesDTO dto : treeNodesDTO5) {
if (nodesDTO.getId().equals(dto.getUpper())) {
temp.add(dto);
}
}
nodesDTO.setNodes(temp);
}
for (TreeNodesDTO nodesDTO : treeNodesDTO3) {
List<TreeNodesDTO> temp = new ArrayList<TreeNodesDTO>();
for (TreeNodesDTO dto : treeNodesDTO4) {
if (nodesDTO.getId().equals(dto.getUpper())) {
temp.add(dto);
}
}
nodesDTO.setNodes(temp);
}
for (TreeNodesDTO nodesDTO : treeNodesDTO2) {
List<TreeNodesDTO> temp = new ArrayList<TreeNodesDTO>();
for (TreeNodesDTO dto : treeNodesDTO3) {
if (nodesDTO.getId().equals(dto.getUpper())) {
temp.add(dto);
}
}
nodesDTO.setNodes(temp);
}
return JSON.toJSON(treeNodesDTO2);
}
}
上一篇: SQL语句中将字符串转成临时表的方法