Ответ 1
Вы можете легко решить проблему с параметром postData
, включая функции и trigger('reloadGrid')
. Я пытаюсь объяснить идею более подробно.
Воспользуемся mtype: "GET"
. Единственное, что стандартное поле поиска/фильтра делает после отображения интерфейса, это добавление некоторых дополнительных параметров в URL-адрес, отправка на сервер и перезагрузка данных сетки. Если у вас есть собственный интерфейс для поиска/фильтрации (например, некоторые элементы управления или флажки), вы должны просто добавить свой url самостоятельно и перезагрузить сетку в отношении trigger('reloadGrid')
. Для сброса информации в сетке вы можете выбрать любой способ, который вы предпочитаете. Например, вы можете включить в элементы управления select, которые у вас есть опция "no filtering".
Чтобы быть более точным, ваш код должен выглядеть как код из ответа как перезагрузить jqgrid в asp.net mvc, когда я меняю dropdownlist:
var myGrid = jQuery("#list").jqGrid({
url: gridDataUrl,
postData: {
StateId: function() { return jQuery("#StateId option:selected").val(); },
CityId: function() { return jQuery("#CityId option:selected").val(); },
hospname: function() { return jQuery("#HospitalName").val(); }
}
// ...
});
//
var myReload = function() {
myGrid.trigger('reloadGrid');
};
var keyupHandler = function (e,refreshFunction,obj) {
var keyCode = e.keyCode || e.which;
if (keyCode === 33 /*page up*/|| keyCode === 34 /*page down*/||
keyCode === 35 /*end*/|| keyCode === 36 /*home*/||
keyCode === 38 /*up arrow*/|| keyCode === 40 /*down arrow*/) {
if (typeof refreshFunction === "function") {
refreshFunction(obj);
}
}
};
// ...
$("#StateId").change(myReload).keyup(function (e) {
keyupHandler(e,myReload,this);
});
$("#CityId").change(myReload).keyup(function (e) {
keyupHandler(e,myReload,this);
});
Если пользователь изменил выбранную опцию в поле выбора с помощью id=StateId
или другого окна выбора с помощью id=CityId
(с помощью мыши или клавиатуры), вызывается функция myReload
, которая просто заставляет перезагружать данные в jqGrid. Во время соответствующего запроса $.ajax
, который jqGrid делает для нас, значение из параметра postData
будет перенаправлено на $.ajax
в качестве параметра data
. Если некоторые из свойств data
являются функциями, эта функция будет вызываться через $.ajax
. Таким образом, будут загружены фактические данные из блоков выбора, и все данные будут добавлены к данным, отправленным на сервер. Вам нужно только реализовать чтение этих параметров в своей серверной части.
Таким образом, данные из параметра postData
будут добавлены к URL-адресу (символы '?' и '&' будут добавлены автоматически, и все специальные символы, такие как пробелы, будут также закодированы, как обычно). Преимущества использования postData
:
- использование функций внутри параметра
postData
позволяет загружать значения фактические из всех используемых элементов управления в момент перезагрузки; - Сохранение кода у вас очень четкое.
- Все работает отлично не только с запросами HTTP GET, но также с HTTP POST;
Если вы используете какие-либо записи "нет фильтрации" или "все" в поле выбора StateId
, вы можете изменить функцию, которая вычисляет значение параметра StateId
, которое должно быть добавлено к URL-адресу сервера из
StateId: function() { return jQuery("#StateId option:selected").val(); }
к чему-то вроде следующего:
StateId: function() {
var val = jQuery("#StateId option:selected").val();
return val === "all"? "": val;
}
На стороне сервера вы не должны фильтровать для StateId
, если вы получите пустое значение в качестве параметра.
По желанию вы можете использовать myGrid.setCaption('A text');
, чтобы изменить заголовок сетки. Это позволяет пользователю более четко видеть, что данные в сетке фильтруются с некоторыми критериями.