select2 利用ajax高效查询数据列表(可搜索、可分页)

$("#cs").select2({
                width: '100%',
                language: "zh-CN",
                ajax: {
                    url: 'https://X.net/list',
                    type:"POST",
                    data: function(params){
                        // 传递到后端的参数
                        return JSON.stringify({
                            // 搜索框内输入的内容 searchInf 后端搜索的字段
                            "searchInfo": params.term,
                            // 当前页  pageIndex后端的字段
                            "pageIndex": (params.page - 1) || 0,
                            // 每页显示多少条记录,默认10条  pageSize后端的字段
                            "pageSize": 10   //pageSize接口入参
                        });
                    },
                    cache:true,
                    delay: 250,//等待用户输入完后的 在等250毫秒 进行搜索
                    processResults: function (data, page) {
                        page.page = page.page || 1;
                        console.log(data);
                        let array = [];
                        data.data.items.forEach(item =>{
                           let arr = {id:item.id,text:item.name};// select2 专用格式
                           array.push(arr);
                        })
                        console.log(array);
                        return {
                            results: array,// 处理过的数据
                            pagination: {
                                more: page.page < data.data.totalPages// 分页
                            }
                        };
                    },
                    escapeMarkup: function (markup) {
                        // 字符转义处理
                        return markup;
                    },
                    // 最少输入N个字符才开始检索,如果想在点击下拉框时加载数据,请设置为 0
                    minimumInputLength: 0,
                }
            });


中文文档:Ajax (远程数据) | Select 2 中文网

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值