即使使用dataUrl

时间:2018-08-23 08:29:58

标签: jquery jqgrid

我正在尝试在用于搜索目的的jqgrid中填充我的自定义选择元素。我正在使用ajaxselectoptions,dataurl和buildselect来构建我的自定义选择元素。使用以下代码

 ajaxSelectOptions: {
                method: 'GET',
                dataType: 'json',
                success:function(response){
                    console.log("getGenders",response);
                }
            },

-- the below code is a part of colmodel option

            name: 'empGender',
            editable: true,
            edittype:'select',
            formatter:'select',
            editoptions:{value:":All;M:Male;F:Female"},
            stype: 'select',
            search: true,
            searchoptions: {
                dataUrl: './getGenders',
                buildSelect: function(data) {
                    console.log(data);
                    var ele = '<select>';
                    $.each(data, function(index, object) {
                        ele+='<option value='+object.id+'>'+object.value+'</option>';
                    });
                    ele=ele+'</select>';
                    //console.log(ele);
                    return ele;
                }
            }

我的成功函数正在执行并在控制台中打印预期的输出。但是之后,当我尝试在搜索选项下使用buildselect函数来构建我的select元素时,由于根本没有执行,所以没有发生。 有人可以帮忙。谢谢您。

1 个答案:

答案 0 :(得分:0)

您遇到的问题是ajaxSelectOptions的定义。在此对象中,您定义成功函数,该函数将覆盖jqGrid中的成功函数。为了使代码起作用,您应该在ajaxSeletOptions中删除此事件。

ajaxSelectOptions: {
            method: 'GET',
            dataType: 'json'
        },
-- the below code is a part of colmodel option

        name: 'empGender',
        editable: true,
        edittype:'select',
        formatter:'select',
        editoptions:{value:":All;M:Male;F:Female"},
        stype: 'select',
        search: true,
        searchoptions: {
            dataUrl: './getGenders',
            buildSelect: function(data) {
                console.log(data);
                var ele = '<select>';
                $.each(data, function(index, object) {
                    ele+='<option value='+object.id+'>'+object.value+'</option>';
                });
                ele=ele+'</select>';
                //console.log(ele);
                return ele;
            }
        }