bootstrap中fuelux.tree的简单使用

最新推荐文章于 2021-08-05 22:48:38 发布

江天涯

最新推荐文章于 2021-08-05 22:48:38 发布

阅读量1.7w

点赞数 1

分类专栏： bootstrap相关

本文链接：https://blog.csdn.net/a473554142/article/details/48972725

版权

本文介绍了如何在Bootstrap中使用FuelUX Tree组件，包括通过AJAX获取树形数据，以及获取选中节点的ID和名称。示例代码展示了如何构造和处理树形数据，特别是数据结构的构建和后台数据的组装。

摘要由CSDN通过智能技术生成

js代码：通过ajax的方式获取tree的数据

$('.page-content-area').ace_ajax('loadScripts', scripts, function() {
jQuery(function($) {

var sampleData = initiateDemoData();

$("#tree1").ace_tree({
dataSource : sampleData['dataSource1'],
multiSelect : false,
folderSelect : false,
cacheItems : true,
'open-icon' : 'ace-icon tree-minus', ///
'close-icon' : 'ace-icon tree-plus',
'selectable' : true,
'selected-icon' : 'ace-icon fa fa-check',
'unselected-icon' : 'ace-icon fa fa-times',
loadingHTML : '<div class="tree-loading"><i class="ace-icon fa fa-refresh fa-spin blue"></i></div>'
}).on('selected.fu.tree', function(e) {

}).on('loaded.fu.tree', function(e) {

}).on('deselected.fu.tree', function(e) {

});

function initiateDemoData() {
var tree_data ;
$.ajax({
url : "",/ajax获取数据的url地址
type : "get",
async: false,
success : function(data) {
tree_data = eval("("+data+")");
},
error:function(data){
}
});

var dataSour