Как динамически передать данные для поиска с помощью jqGrid?

Question

Я использую jqGrid для рендеринга некоторых данных.Теперь я хочу иметь возможность изменять данные на основе значений двух разных полей выбора.Например, у меня есть выпадающий список идентификаторов местоположения и диапазон дат.Я хочу фильтровать по идентификатору местоположения и диапазону дат, обрабатывая эту логику в своем действии /something/search.Как я могу передать эти дополнительные данные в jqGrid динамически?Итак, (1) при начальной загрузке и (2) при возникновении события onChange я передам что-то вроде {data: {location_id: 10, range_start: '1/1/2012', range_end: '1/5/2010'}}.Затем я мог бы прочитать это в качестве параметра, точно так же, как я делаю для "page", "rows", "sidx" и т. Д.

Редактировать: при необходимости включил свой существующий код:

grid.jqGrid({
  url: "/something/search",
  datatype: "json",
  colNames: ['', 'ID', 'Description', 'Start', 'End', 'Last Updated'],
  colModel: [{name:'act',index:'act', width:16,sortable:false},
             { name: 'id', index: 'id', width: 100, hidden: true },
             { name: 'description', index: 'description', width: 200 },
             { name: 'start_date', index: 'start_date', width: 120 },
             { name: 'end_date', index: 'end_date', width: 120 },
             { name: 'last_update', index: 'last_update', width: 120 }],
  rowNum: 20,
  rowList: [10, 20, 50],
  pager: '#data-list-pager',
  sortname: 'ident',
  viewrecords: true,
  sortorder: "desc",
  multiselect: false,
  height: "100%",
  caption: "",
  altRows: true,
  width: 865});

Answer 1

Первый способ решить проблему - это следовать пути, который я описал здесь . В случае, если элементы управления, которые пользователь будет использовать для фильтрации сетки, будут вне сетки.

Другой способ, который я могу предложить, - это использовать Панель инструментов Поиск . Преимущество этого подхода заключается в том, что элементы управления, используемые для поиска, будут интегрированы в сетке. В этом случае вы можете использовать элемент управления select или текстовый ввод с jQuery UI Datepicker.

Чтобы добавить панель инструментов Поиск , вам нужно просто позвонить filterToolbar с параметрами, которые вы предпочитаете. Если вы захотите использовать параметр stringResult: true, формат параметра filters, который будет отправлен на сервер, будет таким же , как в случае использования расширенного поиска. Чтобы определить операцию поиска «больше или равно» для 'start_date' и операцию поиска «меньше или равно» для 'end_date', вам просто нужно добавить searchoptions, имеющий 'ge' или 'le' в качестве первого элемента sopt собственность.

В результате можно будет отфильтровать сетку:

и

см. демо .