Я хочу, чтобы пользователи смогли отфильтровать данные сетки, не используя внутреннее поле поиска.
Я создал два поля ввода для даты (от и до) и теперь должен сказать сетке принимать это как свой фильтр и затем запрашивать новые данные.
Ковка запроса к серверу на данные сетки (обходящий сетку) и устанавливающий данные сетки, чтобы быть работой привычки данных ответа - потому что, как только пользователь пытается переупорядочить результаты или изменить страницу и т.д., сетка запросит новые данные с сервера с помощью пустого фильтра.
Я, может казаться, не нахожу сетку API для достижения этого - у кого-либо есть какие-либо идеи?Спасибо.
Ваша проблема может быть очень легко решена с помощью параметра postData
, включая функции и триггер ('reloadGrid')
. Попробую подробнее объяснить идею.
Давайте использовать mtype: "GET"
. Единственное, что делает стандартный поиск / фильтр после отображения интерфейса, - это добавление некоторых дополнительных параметров к URL-адресу, отправка на сервер и перезагрузка данных сетки. Если у вас есть собственный интерфейс для поиска / фильтрации (например, некоторые элементы управления или флажки), вы должны просто добавить свой URL самостоятельно и перезагрузить сетку с учетом триггера ('reloadGrid')
.Для сброса информации в сетке вы можете выбрать любой способ, который вам больше нравится. Например, вы можете включить в элементы управления выбора, у которых есть опция типа «без фильтрации».
Если быть более точным, ваш код должен выглядеть как код из ответа , как перезагрузить jqgrid в asp.net mvc, когда я меняю раскрывающийся список :
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
позволяет загружать фактические значения из всех используемых элементов управления в момент перезагрузки; Если вы используете некоторые записи «без фильтрации» или «все» в поле выбора 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 ('Текст');
, чтобы изменить заголовок сетки. Это позволяет пользователю более четко видеть, что данные в сетке фильтруются по некоторым критериям.