如何在jgrid上显示搜索到的数据

这与我之前关于jqgrid的问题有关。 我现在正在做一个搜索按钮，它将从服务器中搜索我的输入文本，并在jqgrid中显示这些数据（如果有的话）。 现在，我所做的是创建一个存储filter的全局变量。 这是我搜索和显示的javascript代码：

filter = ''; //this is my global variable for storing filters $('#btnsearchCode').click(function(){ var row_data = ''; var par = { "SessionID": $.cookie("ID"), "dataType": "data", "filters":[{ "name":"code", "comparison":"starts_with", "value":$('#searchCode').val(), }], "recordLimit":50, "recordOffset":0, "rowDataAsObjects":false, "queryRowCount":true, "sort_descending_fields":"main_account_group_desc" } filter="[{'name':'main_account_group_code','comparison':'starts_with','value':$('#searchCode').val()}]"; $('#list1').setGridParam({ url:'json.php?path=' + encodeURI('data/view') + '&json=' + encodeURI(JSON.stringify(par)), datatype: Settings.ajaxDataType, }); $('#list1').trigger('reloadGrid'); $.ajax({ type: 'GET', url: 'json.php?' + $.param({path:'data/view',json:JSON.stringify(par)}), dataType: Settings.ajaxDataType, success: function(data) { if ('error' in data){ showMessage('ERROR: ' + data["error"]["msg"]); } else{ if ( (JSON.stringify(data.result.main.row)) <= 0){ alert('code not found'); } else{ var root=[]; $.each(data['result']['main']['rowdata'], function(rowIndex, rowDataValue) { var row = {}; $.each(rowDataValue, function(columnIndex, rowArrayValue) { var fldName = data['result']['main']['metadata']['fields'][columnIndex].name; row[fldName] = rowArrayValue; }); root[rowIndex] = row; row_data += JSON.stringify(root[rowIndex]) + '\r\n'; }); } alert(row_data); //this alerts all the data that starts with the inputed text... } } }); } 

我发现代码总是输入这个（我计划将此代码用于我的其他表）所以我把filter放在这里：

  $.extend(jQuery.jgrid.defaults, { datatype: 'json', serializeGridData: function(postData) { var jsonParams = { 'SessionID': $.cookie("ID"), 'dataType': 'data', 'filters': filter, 'recordLimit': postData.rows, 'recordOffset': postData.rows * (postData.page - 1), 'rowDataAsObjects': false, 'queryRowCount': true, 'sort_fields': postData.sidx }; return 'json=' + JSON.stringify(jsonParams); }, loadError: function(xhr, msg, e) { showMessage('HTTP error: ' + JSON.stringify(msg) + '.'); }, }); 

现在，我的问题是，为什么它显示错误消息“服务器错误：参数’dataType’未指定”？ 我已经在上面的代码中声明了dataType，但似乎它没有读取它。 这里有谁可以帮我解决如何在网格上显示搜索到的数据？（一个函数是一个很好的帮助）

Answer 1

我根据你们两个问题的信息修改了你的代码。 结果代码将是以下内容：

 var myGrid = $("#list1"); myGrid.jqGrid({ datatype: 'local', url: 'json.php', postData: { path: 'data/view' }, jsonReader: { root: function(obj) { var root = [], fields; if (obj.hasOwnProperty('error')) { alert(obj.error['class'] + ' error: ' + obj.error.msg); } else { fields = obj.result.main.metadata.fields; $.each(obj.result.main.rowdata, function(rowIndex, rowDataValue) { var row = {}; $.each(rowDataValue, function(columnIndex, rowArrayValue) { row[fields[columnIndex].name] = rowArrayValue; }); root.push(row); }); } return root; }, page: "result.main.page", total: "result.main.pageCount", records: "result.main.rows", repeatitems: false, id: "0" }, serializeGridData: function(postData) { var filter = JSON.stringify([ { name:'main_account_group_code', comparison:'starts_with', value:$('#searchCode').val() } ]); var jsonParams = { SessionID: $.cookie("ID"), dataType: 'data', filters: filter, recordLimit: postData.rows, recordOffset: postData.rows * (postData.page - 1), rowDataAsObjects: false, queryRowCount: true, sort_descending_fields:'main_account_group_desc', sort_fields: postData.sidx }; return $.extend({},postData,{json:JSON.stringify(jsonParams)}); }, loadError: function(xhr, msg, e) { alert('HTTP error: ' + JSON.stringify(msg) + '.'); }, colNames:['Code', 'Description','Type'], colModel:[ {name:'code'}, {name:'desc'}, {name:'type'} ], rowNum:10, viewrecords: true, rowList:[10,50,100], pager: '#tblDataPager1', sortname: 'desc', sortorder: 'desc', loadonce:false, height: 250, caption: "Main Account" }); $("#btnsearchCode").click(function() { myGrid.setGridParam({datatype:'json',page:1}).trigger("reloadGrid"); }); 

你可以在这里看到代码。

代码在开头使用datatype:'local' ，因此您将不会向服务器发出请求，将单击“搜索”按钮。 来自serializeGridData的postData参数的serializeGridData将与postData参数组合（将postData参数"&path="+encodeURIComponent('data/view') ）。 此外，所有标准的jqGrid参数将继续发送，并且将另外发送带有您的自定义信息的新json参数。

顺便说一下，如果你想重命名URL中使用的一些标准参数，比如使用recordLimit而不是rows你可以在表单中使用prmNames参数

 prmNames: { rows: "recordLimit" }