select2滚动加载

最新推荐文章于 2025-06-11 18:58:17 发布

原创最新推荐文章于 2025-06-11 18:58:17 发布 · 3.2k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#select2 #select2滚动加载 #select2请求ajax #滚动加载 #滚动加载后台参数

web前端开发专栏收录该内容

51 篇文章

订阅专栏

不能重复初始化需要滚动加载的select2 当有滚动加载的时候初始化不能包括当前的滚动加载的元素

  $("select").not('#department').select2({    //当给所有select2 初始化的时候 不能包括当前的
            language:"zn-CN",
            placeholder:'请选择',
            allowClear: true,//可以清除选项

        });

 $('#department').select2({
            width:200,
            // placeholder: '请选择部门',
            language: "zh-CN",
            data:[{ id: employeeId, text: partmentName}],  //  默认值填写  value 是id  text:是名字 不能使用其他字段
            inputMessage:'信息科',
            ajax: {
                url: ,   //  请求后台借口地址
                dataType: 'json',
                delay: 500,
                data: function (params) {
                    return {
                        keyWord: params.term || '',    //搜索参数
                        page: params.page || 1,        //分页参数
                        rows: params.pagesize || 10,   //每次查询10条记录

                    };
                },
                processResults: function (data, params) {
                    params.page = params.page || 1;
                    var d_l = data.list;
                    for (var i = 0, len = d_l.length; i < len; i++) {
                        d_l[i].id = d_l[i].bck01;   //bck01 后台传回来需要显示的id  根据自己需要写值
                    }
                    return {
                        results: d_l,
                        pagination: {
                            //more: (params.page) < data.paginator.totalPages
                            more: (params.page) < data.totalPage
                        }
                    };
                },
                cache: true
            },
            escapeMarkup: function (markup) {
                return markup;
            },
            templateResult: function (data) {
                if (data.loading) {
                    return data.text;
                } else {
                    return data.bck03;      //bck03 select2的value值   根据自己情况定义
                }
            },
            templateSelection: function (data) {
                return data.bck03||data.text;
            }
        });

取值
$('#home_bak05h').select2('data')[0]

后台传回额数据这些参数是必须的

      mv.setList(page.getList());
      mv.setTotal(page.getTotalNumber());
      mv.setRecordsFiltered(page.getTotalNumber());
      mv.setRecordsTotal(page.getTotalNumber());
      mv.setRecords(page.getTotalNumber());
      mv.setTotalPage(page.getTotalPage());