bootstrap中怎么利用treeview动态获取数据
本篇文章为大家展示了bootstrap 中怎么利用treeview动态获取数据，内容简明扼要并且容易理解，绝对能使你眼前一亮，通过这篇文章的详细介绍希望你能有所收获。
目前创新互联公司已为上千家的企业提供了网站建设、域名、网页空间、网站托管维护、企业网站设计、班戈网站维护等服务，公司将坚持客户导向、应用为本的策略，正道将秉承"和谐、参与、激情"的文化，与客户和合作伙伴齐心协力一起成长，共同发展。
1.前端页面引入：
github地址： https://github.com/jonmiles/bootstrap-treeview
demo预览地址：http://jonmiles.github.io/bootstrap-treeview/
2.html页面：
父节点：
JS代码:
$.ajax({
type: "GET",
url: prefix+ "/getAreaTreeData",
cache: false,
contentType: false,
processData: false,
success: function(result) {
if(result!=null && result!=""){
$("#parentAreaName").click(function() {
var options = {
levels: 0,
data : result,
onNodeSelected : function(event, data) {
$("#parentAreaCode").val(data.id);
$("#parentAreaName").val(data.text);
$("#treeviews").hide();
}
};
$('#treeviews').treeview(options);
});
}
},
error: function(error) {
$.modal.alertWarning("获取数据失败");
}
})
$("#parentAreaName").blur(function(){
setTimeout(function(){
$("#treeviews").hide();
},300
);
});后台代码：
@GetMapping("/getAreaTreeData")
@ResponseBody
public List getAreaTreeData() {
List treeViewList = deviceAreaService.getAreaTreeData();
return treeViewList;
}主要两个实体类，拼接数据，当然还可以根据需要添加额外的属性具体参考官网的属性进行添加：
State类（主要是一些状态的控制）：
public class State {
private boolean expanded;
private boolean selected;
public boolean isExpanded() {
return expanded;
}
public void setExpanded(boolean expanded) {
this.expanded = expanded;
}
public boolean isSelected() {
return selected;
}
public void setSelected(boolean selected) {
this.selected = selected;
}
}TreeView类：
import java.util.List;
public class TreeView implements java.io.Serializable{
private String id;
private String text;
private List nodes;
private State state;
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 State getState() {
return state;
}
public void setState(State state) {
this.state = state;
}
public List getNodes() {
return nodes;
}
public void setNodes(List nodes) {
this.nodes = nodes;
}
}上述内容就是bootstrap 中怎么利用treeview动态获取数据，你们学到知识或技能了吗？如果还想学到更多技能或者丰富自己的知识储备，欢迎关注创新互联行业资讯频道。
名称栏目：bootstrap中怎么利用treeview动态获取数据
转载来于：http://bzwzjz.com/article/pespgj.html
