[select2] Ajax分页获取数据
1. 设置select元素ID.
2. 配置API地址,如果需要身份认证,就添加headers.
3. 后端需要返回
results,形如 [ { id:"option的值" , text:"option的显示文本" } ].
ItemCount , 数据总数.
$('select元素ID').select2({ placeholder: '', allowClear: true, ajax: { url: "API地址", delay: 500, headers: { 'Authorization': 'Bearer ' + "Token值" }, data: function (params) { var query = { searchText: params.term, page: params.page || 1 } return query; }, processResults: function (data, params) { params.page = params.page || 1; return { results: data.results, pagination: { more: (params.page * 10) < data.ItemCount } } } } });
Select2选中事件,后端返回的results中,除了id,text还可以带其他数据.
有些情况下需要通过选中数据带出其他数据,可以使用e.params.data['属性名'] 把需要的数据获取出来,填充到其他元素中.
// 选中事件 $("select元素ID").on("select2:select", function (e) { // e.params.data['属性名']; });
分类:
Select2
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通