作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我使用 Fuel UX Tree用于加载 TreeView 数据的框架。
在第一次加载文档时, TreeView 正确呈现,但是当我尝试使用新的 DataSource
重新加载树时,我什么也没得到。
这是我的代码示例:
树 UI 模板:
<div id="MyTree" class="tree tree-plus-minus tree-no-line tree-unselectable">
<div class="tree-folder" style="display:none;">
<div class="tree-folder-header">
<i class="fa fa-folder"></i>
<div class="tree-folder-name">
</div>
</div>
<div class="tree-folder-content">
</div>
<div class="tree-loader" style="display:none">
</div>
</div>
<div class="tree-item" style="display:none;">
<i class="tree-dot"></i>
<div class="tree-item-name">
</div>
</div>
</div>
Tree UI 初始化函数:
var UITree = function () {
return {
//main function to initiate the module
init: function (el, data) {
if (typeof el != 'undefined' && typeof data == 'object') {
var DataSourceTree = function (options) {
this._data = options.data;
this._delay = options.delay;
};
DataSourceTree.prototype = {
data: function (options, callback) {
var self = this;
var data = $.extend(true, [], self._data);
callback({ data: data });
}
};
var treeDataSource = new DataSourceTree(data);
$(el).tree({
selectable: false,
dataSource: treeDataSource,
loadingHTML: '<img src="assets/img/input-spinner.gif"/>',
});
}
}
};
}();
.
在使用 Ajax 加载数据后,我调用 init
函数:
//my data from ajax result
var myData = {
"data": [
{
"name": "some_name",
"type": "item"
},
{
"name": "some_name_2",
"type": "item"
}
]
};
// call tree init to render data
UITree.init($('#MyTree'), myData);
函数运行没有错误,并且只在第一次加载页面时渲染树,而不是在下一次 Ajax 调用时渲染树。
最佳答案
终于找到了解决办法。也许这不是最佳做法,但这是我发现的唯一方法:
当元素已经分配了数据属性时,看起来 Fuelux Tree UI
不起作用,所以我做了这个:
// 1. Clear MyTree wrapper template with:
$('#MyTree .tree-item:visible').remove();
// 2. remove assigned data from template element object
delete($('#MyTree').data().tree);
// 3. Refactor Tree UI
$('#MyTree').tree({
selectable: false,
dataSource: {
data: function(options, callback) {
callback(MyData);
}
}
});
我搜索了整个互联网,重新阅读了 Fuelux
文档,但是没有提到重构 Tree UI
,所以如果有人遇到同样的问题,这个解决方案可以帮助。
关于javascript - 如何在 Fuel UX Tree 中重新加载数据 |查询,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24841479/
我是一名优秀的程序员,十分优秀!