发送 post 请求并在 jqgrid 中显示数据

Question

伙计们，我在这里需要一些帮助，我正在将数据从 AJAX POST 发布到控制器，我正在控制器中获取所有参数，并从控制器返回列表。我想要的是在 jqgrid 中将列表显示为 table 但现在我没有在我的 jqgrid 中获取任何数据。成功后我调用 jqgrid 来显示数据，我相信我在那里做错了。以下是我的代码示例，我们将不胜感激任何帮助。看起来内容类型弄乱了我的 jqgrid。在 ajax 调用中我的内容类型为 false 因为我正在传递多部分文件但是从控制器我返回 json 字符串，如果我将内容类型或数据类型作为 json 在 ajax 调用然后我的多部分文件没有被发送到控制器。有人可以解释一下这个问题吗？

//posting data through ajax
function SubmitButtonOnclick() {
        var pParam = new FormData();
        pParam.append = ("file", $('input[type=file]')[0]).files[0]); //multipart file

        pParam.append("name", $("#name").val());
        pParam.append("country", $("#country").val());
       
        var url="";
        $.ajax({
            type: "POST",
            url: '/process/rdata',
            data: pParam,
            enctype: 'multipart/form-data',
            dataType: 'json',
            contentType: false,
            processData: false,
            success: function (response) {
            //display jq grid on sucess
               $("displayTable").jqGrid('setGridParam',     {url:url, page:1})
            },
            error: function (error) {
                alert("error here");
            }
        });
    }
    
    
    //this is is my jqgrid document on ready
    $(function() {
  $("#displayTable").jqGrid({
      datatype: 'json',
   mtype: 'POST',
      altrows:true,
      colNames:['Country percent', 'Visited','Name'],
      colModel:[
       {name:'countryper',index:'countryper', width:90, editable:false},
          {name:'visited',index:'visited', width:100, sortable:false, editable:true, editrules:{required:true}, editoptions:{size:10},formatter:returnEmailUserLink},
       {name:'name',index:'name', width:90, editable:true, editrules:{required:true}, editoptions:{size:10}},
       
      ],
      
   rowNum:100,
      pager: '#tablepager',
      viewrecords: true,
      multiselect: false,
      loadonce: true,
        jsonReader : {
          root: "rows",
          page: "page",
          total: "total",
          records: "records",
          repeatitems: false,
          cell: "",
         
      }
      loadComplete: function() {
       
  });

  $("#displayTable").jqGrid('navGrid','#tablepager',
    {edit:false, add:false, del:false, search:false},
    {}, {}, {}       
  );
  
  
});

<label>upload here to search</label>
<input type="file" id="file" name="file">
<input type="name" id="name" name="name">
<input type="country" id="country" name="country">


<!--for jqgrid-->
<div id="displayTable"></div>
<div id="tablepager"></div>


<!--my controller-->

public List<ModClass> returnData(){


return list;
}

Answer 1

成功函数中jqGrid设置参数url后需要触发grid重新加载数据

        success: function (response) {
        //display jq grid on sucess
           $("displayTable").jqGrid('setGridParam',{url:url, page:1}).trigger("reloadGrid");
        },

发送 post 请求并在 jqgrid 中显示数据

sending post request and displaying data in jqgrid

jquery

spring-mvc

jqgrid