Bootstrap treeview实现动态加载数据并添加快捷搜索功能

前端之家收集整理的这篇文章主要介绍了Bootstrap treeview实现动态加载数据并添加快捷搜索功能前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

写在前面:

jQuery多级列表树插件基于Bootstrap,以简单和优雅的方式来显示一些继承树结构,如视图树、列表树等。

实用Bootstrap树形菜单特效插件Bootstrap Tree View,非常不错的Bootstrap插件,现在很多Bootstrap制作的页面都需要此功能,此插件需要Bootstrap3版本以及jQuery 2.0极以上版本支持支持多参数自定义功能,颜色、背景色、图标、链接等,还是很不错的。

具体效果请暂时移步: nofollow" href="http://jonmiles.github.io/bootstrap-treeview/">http://jonmiles.github.io/bootstrap-treeview/

好了,话不多说,开整。

要求用户能够快速查询到省市区的区域名称信息(给用户参考,用于规范书写导入模板),并且以树形结构展示。

最终效果展示:

一、 数据表结构 数据源为省市区地域信息表,该表为自关联结构。如图:

二、前台页面

1.页面引入

@H_301_37@

2.页面展示区

快捷搜索
搜索: 查询的省市区名称信息..." value=""> @H_301_37@ **_ _**