jqGrid с включенным расширенным поиском различных звонков на сервер

Question

У меня есть jqGrid на странице, завернутой в веб-часть ASP.NET. Вот его определение:

$("#referent_grid").jqGrid({
    url: '<%= SPContext.Current.Site.Url %>' + wsBaseUrl + 'ReferentService.asmx/ListReferents',
    colNames: ['Full Name', 'Phone Number', 'Email', 'Department'],
    colModel: [
        { name: 'FullName', index: 'FullName', width: 240, align: 'left', search: true, stype: 'text', searchoptions: { sopt: ['eq', 'bw', 'bn', 'ew', 'en', 'cn', 'nc']} },
        { name: 'PhoneNumber', index: 'PhoneNumber', width: 120, align: 'left', search: true, stype: 'text', searchoptions: { sopt: ['eq', 'bw', 'bn', 'ew', 'en', 'cn', 'nc']} },
        { name: 'Email', index: 'Email', width: 180, align: 'left', search: true, stype: 'text', searchoptions: { sopt: ['eq', 'bw', 'bn', 'ew', 'en', 'cn', 'nc']} },
        { name: 'Department', index: 'Department', width: 180, align: 'left', search: true, stype: 'text', searchoptions: { sopt: ['eq', 'bw', 'bn', 'ew', 'en', 'cn', 'nc']} },
    ],
    jsonReader: {
        id: "ReferentID"
    },
    pager: $('#referent_grid_pager'),
    sortname: 'FullName',
    sortorder: "asc",
    height: '300',
    shrinkToFit: false,
    caption: 'Referent List'
});
$("#referent_grid").jqGrid('navGrid', '#referent_grid_pager',
    { add: true, addtitle: 'Add Referent', edit: true, edittitle: 'Edit Referent',
      del: true, deltitle: 'Delete Referent', refresh: true, refreshtitle: 'Refresh data',
      search: true, searchtitle: 'Advanced search filters',
      addfunc: addReferent, editfunc: editReferent
    },
    {}, // default settings for edit
    {}, // default settings for add
    { // define settings for Delete 
        mtype: "post", reloadAfterSubmit: true,
        url: '<%= SPContext.Current.Site.Url %>' + wsBaseUrl + 'ReferentService.asmx/DeleteReferent',
        resize: false,
        serializeDelData: function (postdata) {
            return JSON.stringify({ referentID: postdata.id });
        },
        afterSubmit: function (data, postdata) {
            var result = $.parseJSON(data.responseText);
            return [true, ''];
        }
    },
    { closeOnEscape: true, multipleSearch: true, closeAfterSearch: true }, // search options
    {}
);

Как видите, у меня включен расширенный поиск. Проблема, с которой я сталкиваюсь, заключается в том, что при первом вызове страницы jqGrid вызывает метод ListReferents без передачи параметра filters, как вы можете видеть на следующем снимке экрана Fiddler

Когда я нажимаю кнопку refresh в jqGrid, она вызывает метод ListReferents, передавая параметр filters, как вы можете видеть на следующем скриншоте из Fiddler

Для этого я определил два метода в своем веб-сервисе, но первый метод никогда не вызывается, в то время как второй.

[WebMethod]
public JQGridData ListReferents(string _search, string nd, string rows, string page, string sidx, string sord) {
    return ListReferents(_search, nd, rows, page, sidx, sord, string.Empty);
}

[WebMethod]
public JQGridData ListReferents(string _search, string nd, string rows, string page, string sidx, string sord, string filters) {
    // method code here
}

Где я делаю не так?

Answer 1

Проблема в том, что все параметры веб-службы должны быть определены.В запросе к серверу всегда определены только 5 стандартных параметров: _search, rows, page, sidx, sord.Таким образом, вы должны проверить внутри serializeGridData, определено ли свойство filter в postData.Если не определено, вы должны установить его на null или на пустую строку "":

serializeGridData: function (postData) {
    if (postData.filters === undefined) postData.filters = null;
    return JSON.stringify(postData);
}

(см. здесь пример).Это должно решить вашу проблему.

Кроме того, вы должны убрать тралирующие запятые в определении colModel (camma перед ']').

Еще одно небольшое предложение.Вы можете упростить определение столбца в colModel.Прежде всего вы можете удалить align: 'left', search: true, stype: 'text' свойства, которые являются настройками по умолчанию (см. документацию ).Более того, если у вас есть некоторые общие настройки в большинстве столбцов, вы можете переопределить значения по умолчанию для colModel сетки с учетом cmTemplate параметров:

colModel: [
    { name: 'FullName', index: 'FullName', width: 240 },
    { name: 'PhoneNumber', index: 'PhoneNumber', width: 120 },
    { name: 'Email', index: 'Email', width: 180 },
    { name: 'Department', index: 'Department', width: 180 }
],
cmTemplate: { searchoptions: { sopt: ['eq', 'bw', 'bn', 'ew', 'en', 'cn', 'nc']} }

подробнее о шаблонах столбцов здесь .