是否有一个好的treeview控件支持ajax搜索,过滤?

时间:2011-03-14 20:58:06

标签: php javascript jquery jquery-ui

我一直在寻找一个javascript树形视图控件,它支持“即时”搜索,过滤(类似于自动完成框)。

我发现ExtJS具有该功能,但它太大了(约800 KB js)。我也喜欢jquery TreeTable控件,但我不确定它是否支持该功能。

请指教。非常感谢任何建议,非常感谢。

6 个答案:

答案 0 :(得分:4)

我建议jstree,它确实附带了一些不错的插件,例如用于从服务器获取节点的json插件,以及搜索插件。

这不是您理想的搜索行为的完美解决方案,但您可以利用此优势:

“搜索插件可以搜索标题中包含给定字符串的节点,也可以处理异步树。所有找到的节点都会将jstree-search类应用于它们包含的节点 - 您可以使用该类来设置样式搜索结果。“

因此,如果您知道所有节点都获得此类,您可以事先轻松隐藏所有节点,然后让搜索插件添加此类,该类覆盖(!important)css类的display属性。

答案 1 :(得分:3)

您可以查看这篇文章8 Useful JQuery TreeView Examples

答案 2 :(得分:0)

从obout.com查看TreeView组件。但它是ASP.NET。

答案 3 :(得分:0)

尝试http://www.addobject.com/nlstree这是一个商业解决方案,但我遇到过的最好的解决方案。记录完备,非常灵活,具有良好的整体性能。它的行为可以使用它暴露的各种事件轻松扩展。

如果这个不适合您的要求,最好开始编码。

答案 4 :(得分:0)

转到jstree。它的轻盈和良好。

答案 5 :(得分:-2)

现在,网站或Web应用程序中的800 KB并不算太多。 输入Google,输入“jquery treeview plugin”(即时搜索已启用),您将下载大约250 KB,但您甚至没有眨眼。

我不是 Ext JS的忠实粉丝,我对jQuery + jQuery UI +插件+ jQuery工具等感到惊讶。但Ext JS TreeView非常有用,可以随时使用

lots of possibilities with TreeView(甚至是TreeGrid,我认为是你正在寻找的TreeTable)。

你也可以尝试创建你自己的Ext JS treeview包(它们曾经有一个Ext JS构建器,但它不再可用)只有必需的依赖项。

我认为使用Ext JS时的主要问题是当你绘制复杂的接口时,例如: http://dev.sencha.com/deploy/dev/examples/feed-viewer/view.html

http://dev.sencha.com/deploy/dev/examples/desktop/desktop.html

http://dev.sencha.com/deploy/dev/examples/calendar/index.html

但是你可以尝试一个TreeView(一个TreeGrid)的复杂例子,你会发现它不是太多: http://dev.sencha.com/deploy/dev/examples/treegrid/treegrid.html

希望这有帮助