在jqGrid中将“搜索”远程和其他所有内容（排序，分页等）本地化
我正在开发一个Django项目，该项目使用JQgrid显示数据库中的数据。
我想要实现的是只有搜索选项连接到执行远程搜索，其中服务器将返回结果集，并且每个其他jqgrid选项（如列排序，分页等）将在客户端执行。
我知道这可以通过设置loadonce:true并根据loadonce:true .click()事件在'local'和'json'之间切换'datatype'参数来完成，具体取决于我是单击sort还是next-page，search等。
还有另一种方法吗？ 如果没有，你们可以建议一个干净的方式来做上述黑客攻击。
谢谢！
我设法完成了这项工作，我很高兴与大家分享这一切。 我在解释下面发布了我的整个jqgrid代码供您参考。
首先，我使用JSON作为结果，因此使用jsonReader。
接下来，以下是特定于实现{{search：remote}，{sorting：local}，{pagination：local}}行为的设置。
-
设置
loadonce: false或者点击“搜索”按钮不会命中服务器，而是始终进行本地搜索。 -
我想实现jqGrid的多重搜索function，因此可以在你的寻呼机栏中显示微小的“放大镜”。
jQuery("#list2").jqGrid('navGrid','#pager2',{ del:false,add:false,edit:false},{},{},{},{multipleSearch:true}); -
现在我如何实现远程搜索function是通过在onSearch和onClose事件上将数据类型从local切换到json。 即在触发搜索查询（即单击“查找”按钮）时，我将loadonce设置为false，将数据类型设置为json。 这确保了远程搜索。 既然我们的网格填充了远程搜索数据，我们必须切换回数据类型：local，但显式设置onClose不起作用，所以我设置loadonce：true，稍后设置数据类型：local本身。 另请注意，我有closeAfterSearch：true，closeOnEscape：true，因此我确保在触发搜索查询后始终关闭onClose事件。
jQuery("#list2").jqGrid('searchGrid', {multipleSearch: true, closeAfterSearch: true, closeOnEscape: true, onSearch: function(){$("#list2").setGridParam({loadonce: false, datatype: 'json'}); $("#list2").trigger("reloadGrid"); }, onClose: function(){$("#list2").trigger("reloadGrid"); $("#list2").setGridParam({loadonce: true}); $(".ui-icon-refresh").trigger('click'); } });
$(".ui-icon-refresh").trigger('click'); 加载结果后强制刷新。 在某些情况下这是必要的（不知道为什么）。 我自己偶然发现了这个问题，我不知道为什么会这样。 如果你有一个想法，我很想知道背后的原因。
-
最后，每次加载网格时，默认情况下都会弹出搜索框。 所以我只需点击模式框的’x’按钮就强行关闭它。 Hacky但是有效！ ：P
$(".ui-icon-closethick").trigger('click');
<<<整个jqGrid代码>>>
请原谅我代码中的’xyz’。 我在那里有一些Django代码，所以我只是用xyz替换它以避免任何混淆。
jQuery(document).ready(function(){ $("#list2").jqGrid({ url:'xyz', datatype: 'json', loadonce: false, mtype: 'GET', colNames:xyz colModel :xyz, jsonReader : { repeatitems: false, root: "rows", page: "page", total: "total", records: "records" }, height: '100%', width: '100%', pager: '#pager2', rowNum:15, rowList:[10,15,30], viewrecords: true, caption: ' ', autowidth: false, shrinkToFit: true, ignoreCase:true, gridview: true }); jQuery("#list2").jqGrid('navGrid','#pager2',{ del:false,add:false,edit:false},{},{},{}, {multipleSearch:true}); jQuery("#list2").jqGrid('navButtonAdd', '#pager2', { caption: "", buttonicon: "ui-icon-calculator", title: "choose columns", onClickButton: function() { jQuery("#list2").jqGrid('columnChooser'); } }); jQuery("#list2").jqGrid('searchGrid', {multipleSearch: true, closeAfterSearch: true, closeOnEscape: true, onSearch: function(){$("#list2").setGridParam({loadonce: false, datatype: 'json'}); $("#list2").trigger("reloadGrid"); }, onClose: function(){$("#list2").trigger("reloadGrid"); $("#list2").setGridParam({loadonce: true}); $(".ui-icon-refresh").trigger('click'); } }); $(window).bind('resize', function () { clearTimeout(resizeTimer); resizeTimer = setTimeout(resizeGrids, 60); divwidth = $(".content-box-header").width() - 40; //alert(divwidth); $("#list2").setGridWidth(divwidth,true); }); $(window).resize(); $(".ui-icon-closethick").trigger('click'); });
如果你看下面的代码，我正在工具栏上的两个日期之间进行搜索，“e”是我正在使用的我的控件的ID。 现在关键因素是名为“搜索”的属性，如果将其设置为“true”，它将进行客户端搜索，false将远程搜索到您要为搜索调用的任何ajax方法。
var gridFilter; var fieldId = e.replace('#', ''); var fieldForFilter = fieldId.replace('gs_', '');//All toolbar filters Id's are the same as the column Id but prefixed with "gs_" var splitteddates = $("#" +fieldId).val().split('-'); var grid = $("#GridJq1"); gridFilter = { groupOp: "AND", rules: [] }; gridFilter.rules.push({ field: "" + fieldForFilter + "", op: "gt", data: "" + $.trim(splitteddates[0]) + "" }); gridFilter.rules.push({ field: "" + fieldForFilter + "", op: "lt", data: "" + $.trim(splitteddates[1]) + "" }); grid[0].p.search = true;//specifies wether to do a client search or a server search which will be done manually. true=client search $.extend(grid[0].p.postData, { filters: JSON.stringify(gridFilter) });//combine post data and newly added filter data grid.trigger("reloadGrid", [{ page: 1, current: true}]);//reset to page and keep current selection if any
如果我没记错的话，上面用于构建搜索的部分代码来自着名的JQGrid Oleg的回答，如果这是他的代码的一部分，那么他会感激不尽。