Как отфильтровать jqGrid данные, не используя созданный в поиске/блоке фильтров

Я хочу, чтобы пользователи смогли отфильтровать данные сетки, не используя внутреннее поле поиска.

Я создал два поля ввода для даты (от и до) и теперь должен сказать сетке принимать это как свой фильтр и затем запрашивать новые данные.

Ковка запроса к серверу на данные сетки (обходящий сетку) и устанавливающий данные сетки, чтобы быть работой привычки данных ответа - потому что, как только пользователь пытается переупорядочить результаты или изменить страницу и т.д., сетка запросит новые данные с сервера с помощью пустого фильтра.

Я, может казаться, не нахожу сетку API для достижения этого - у кого-либо есть какие-либо идеи?Спасибо.

58
задан Jimbo 28 May 2010 в 10:58
поделиться

1 ответ

Ваша проблема может быть очень легко решена с помощью параметра 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 :

  1. использование функций внутри параметра postData позволяет загружать фактические значения из всех используемых элементов управления в момент перезагрузки;
  2. Ваше пребывание кода имеет очень четкую структуру.
  3. All отлично работает не только с 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 ('Текст'); , чтобы изменить заголовок сетки. Это позволяет пользователю более четко видеть, что данные в сетке фильтруются по некоторым критериям.

78
ответ дан 24 November 2019 в 19:05
поделиться
Другие вопросы по тегам:

Похожие вопросы: