js select2插件多个下拉框的实现

for (var i = 0; i < headerList.length; i++) {
                var headerAssay = headerList[i];
                $("#" + headerAssay.reportId).select2({
                    ajax: {
                        //远程数据地址
                        url: "<%=apiPath %>/api/v1/hisAssayDetailInfo/listAssayDetails",
                        dataType: 'json',
                        delay: 200,
                        data: function (params) {
                            return {
                                search: params.term, // 搜索框内输入的内容，传递到Java后端的
                                page: params.page || 1,  // 第几页，分页
                                rows: 10,// 每页显示多少行
                                headerId: headerId
                            };
                        },
                        processResults: function (data, params) {
                            params.page = params.page || 1;
                            return {
                                results: (data.body.options == null ? [] : data.body.options),
                                pagination: {
                                    more: (params.page) < data.body.pageCount
                                }
                            };
                        },
                        cache: false
                    },
                    escapeMarkup: function (markup) {
                        return markup;
                    },

现在界面上有i个下拉框，每个headerId都不相同，我想点击每个下拉框的时候查询出对应下拉框中的内容；
目前不论点击哪个下拉框，传到后台的headerId都是最后一个下拉框的headerId。

6 个解决方案

#1

headerId 的定义呢？肯定是headerId的值的问题，你打印出来看一下就知道了

#2

引用 1 楼 u011085172 的回复:

headerId 的定义呢？肯定是headerId的值的问题，你打印出来看一下就知道了

headerId是后台传过来的参数呀，在对象headerAssay里面，这里我好像复制的时候弄错了应该是headerAssay .headerId 

#3

引用 2 楼 qq_31671833 的回复:

Quote: 引用 1 楼 u011085172 的回复:

headerId 的定义呢？肯定是headerId的值的问题，你打印出来看一下就知道了

headerId是后台传过来的参数呀，在对象headerAssay里面，这里我好像复制的时候弄错了应该是headerAssay .headerId 

headerAssay .headerId那这个的值你打印一下，看看是不是有问题。代码看不出问题

#4

headerAssayList中有三个headerId值，分别是：F_9086;F_6085;F_3028;但是不论点击哪个下拉框打印出来的headerId都是F_3028

#5

做个闭包，要不for完毕后你的变量时最后一个，而不是当时的值

    for (var i = 0; i < headerList.length; i++) {
        (function(i){
            var headerAssay = headerList[i];
            $("#" + headerAssay.reportId).select2({
                ajax: {
                    //远程数据地址
                    url: "<%=apiPath %>/api/v1/hisAssayDetailInfo/listAssayDetails",
                    dataType: 'json',
                    delay: 200,
                    data: function (params) {
                        return {
                            search: params.term, // 搜索框内输入的内容，传递到Java后端的
                            page: params.page || 1,  // 第几页，分页
                            rows: 10,// 每页显示多少行
                            headerId: headerId
                        };
                    },
                    processResults: function (data, params) {
                        params.page = params.page || 1;
                        return {
                            results: (data.body.options == null ? [] : data.body.options),
                            pagination: {
                                more: (params.page) < data.body.pageCount
                            }
                        };
                    },
                    cache: false
                },
                escapeMarkup: function (markup) {
                    return markup;
                }
            });
        })(i)
    }

Web开发学习资料推荐
jqGrid中文API
JavaScript apply与call的用法

#6

引用 5 楼 showbo 的回复:

做个闭包，要不for完毕后你的变量时最后一个，而不是当时的值

    for (var i = 0; i < headerList.length; i++) {
        (function(i){
            var headerAssay = headerList[i];
            $("#" + headerAssay.reportId).select2({
                ajax: {
                    //远程数据地址
                    url: "<%=apiPath %>/api/v1/hisAssayDetailInfo/listAssayDetails",
                    dataType: 'json',
                    delay: 200,
                    data: function (params) {
                        return {
                            search: params.term, // 搜索框内输入的内容，传递到Java后端的
                            page: params.page || 1,  // 第几页，分页
                            rows: 10,// 每页显示多少行
                            headerId: headerId
                        };
                    },
                    processResults: function (data, params) {
                        params.page = params.page || 1;
                        return {
                            results: (data.body.options == null ? [] : data.body.options),
                            pagination: {
                                more: (params.page) < data.body.pageCount
                            }
                        };
                    },
                    cache: false
                },
                escapeMarkup: function (markup) {
                    return markup;
                }
            });
        })(i)
    }

Web开发学习资料推荐
jqGrid中文API
JavaScript apply与call的用法

是的，添加闭包后能够正常使用了。非常感谢