我有一个这样的形式：
<form id='myForm'> <input type='text' name='search' /> <input type='text' name='maxPrice' /> </form>
和我的jqGrid表：
<table id='myGrid'></table>
我需要将数据从myForm POST(而不是GET)发送到我的服务器方法，以便获取行数据并填充网格。到目前为止，我无法让jqGrid发布任何东西。我仔细检查了我的数据序列化，并正确序列化了我的表单数据。这是我的jqGrid代码：
$("#myGrid").jqGrid({
url: '/Products/Search") %>',postData: $("#myForm").serialize(),datatype: "json",mtype: 'POST',colNames: ['Product Name','Price','Weight'],colModel: [
{ name: 'ProductName',index: 'ProductName',width: 100,align: 'left' },{ name: 'Price',index: 'Price',width: 50,{ name: 'Weight',index: 'Weight',align: 'left' }
],rowNum: 20,rowList: [10,20,30],imgpath: gridimgpath,height: 'auto',width: '700',//pager: $('#pager'),sortname: 'ProductName',viewrecords: true,sortorder: "desc",caption: "Products",ajaxGridOptions: { contentType: "application/json" },headertitles: true,sortable: true,jsonReader: {
repeatitems: false,root: function(obj) { return obj.Items; },page: function(obj) { return obj.CurrentPage; },total: function(obj) { return obj.TotalPages; },records: function(obj) { return obj.ItemCount; },id: "ProductId"
}
});
你能看到我做错了什么或应该做的不同吗？
解决方法
您的主要错误是postData参数的用法：
postData: $("#myForm").serialize()
这个用法有两个问题：
>值$(“#myForm”)。serialize()覆盖POST请求的所有参数，而不是添加其他参数。
>在网格初始化时间内，$(“#myForm”)。serialize()的值将只计算一次。所以你会发送always search =“”和maxPrice =“”到服务器。
我建议您将命名的编辑字段替换为
<fieldset> <input type='text' id='search' /> <input type='text' id='maxPrice' /> <button type='button' id='startSearch'>Search</button> </fieldset>
使用方法将postData参数定义为对象：
postData: {
search: function() { return $("#search").val(); },maxPrice: function() { return $("#maxPrice").val(); },},
并添加onclick事件处理程序到“搜索”按钮(见上面的HTML片段)
$("#startSearch").click(function() {
$("#myGrid").trigger("reloadGrid");
});
此外，您对使用的服务器技术一无所知。可以通过一些额外的修改来查看服务器端的参数(例如serializeRowData：function(data){return JSON.stringify(data);}见this和this)。我建议你还要看另一个旧答案：How to filter the jqGrid data NOT using the built in search/filter box。
一些其他小错误，如’/ Products / Search’)％>’而不是’/ Products / Search’或不推荐使用的参数imgpath(参见documentation)不太重要，默认列选项如align：’left’应该更好地删除。
还要考虑在网格中使用搜索。例如advance searching
$("#myGrid").jqGrid('navGrid','#pager',{add:false,edit:false,del:false,search:true,refresh:true},{},{multipleSearch:true});
$("#myGrid").jqGrid('filterToolbar',{stringResult:true,searchOnEnter:true,defaultSearch:"cn"});
它可能会替换您使用的搜索表单。
