如何使用jqGrid动态传入数据进行搜索？

Question

我正在使用jqGrid来渲染一些数据。现在我希望能够根据两个不同选择框的值修改数据。例如，我有一个位置ID的下拉列表和日期范围的下拉列表。我想根据位置ID和日期范围进行过滤，在我的/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

解决问题的第一种方法是按照我所描述的方式here。如果用户将用于过滤网格的控件将位于网格之外。

我建议的另一种方法是使用Toolbar Searching。该方法的优点是用于搜索的控件将集成在网格中。在这种情况下，您可以使用jQuery UI Datepicker选择控件或文本输入。

要添加Toolbar Searching，只需使用您喜欢的参数调用filterToolbar即可。如果你是stringResult：true选项，那么将发送到服务器的filters参数的格式将是the same，就像使用高级搜索一样。要为'start_date'定义“更大或相等”的搜索操作以及'end_date'的“更少或相等”搜索操作，您只需添加searchoptions 'ge'或{{{} 1}}作为'le'属性的第一个元素。

结果，我们可以过滤网格：

和

请参阅the demo。