记一次使用selectPage下拉分页的体验。

记一次使用selectPage下拉分页的体验。
文章图片

如图,效果。下面贴代码。
记一次使用selectPage下拉分页的体验。
文章图片

记一次使用selectPage下拉分页的体验。
文章图片

比较老的一个项目了,jsp 页面,selectPage是基于bootstrap框架的下拉分页插件,如上,先引入必要的js'和
css。
记一次使用selectPage下拉分页的体验。
文章图片
注意input里的 name(用于提交表单时,得到值。) id(用于初始化selectPage的)
记一次使用selectPage下拉分页的体验。
文章图片

上面是js里的代码。showfield 是下拉列表显示的值, keyField 则是 input 的value值, (你可以自己设置input的name属性,与你实体类的属性相同。便于提交表单。)
pageSize 每页显示15条。 dropButton 表示关闭下拉的那个图标(貌似是的)
记一次使用selectPage下拉分页的体验。
文章图片

后台代码,把返回的数据转成json'对象放到model里。
【记一次使用selectPage下拉分页的体验。】总体而言,这个下拉分页还是很好用的的,我的下拉数据有两千多条,如果用select在jsp遍历出来,需要卡几分钟,而使用这个后台返回json,前台分页显示,速度效率杠杠的,而且还有模糊搜索匹配。
最后 附上此插件的地址:https://terryz.gitee.io/selectpage/
官网里有详细的参数配置和示例。有需要的小伙伴可以参考,










    推荐阅读