issue with ajax call on paging in jqgrid

2019-07-27 11:35发布

问题:

I have constructed the jqgrid using struts2-jquery-jqgrid plugins. Everything is working great except paging,

Problem : When I click on the next button in pager, I want to perform some ajax-based operation. I am using onPaging(jqgrid method) or onPagingTopics topics(jqgrid-plugins) to trap the paging event. I get this paging event successfully but from here actual problem starts. When I click on next button, I trap the paging event using onPagingTopics Topics, inside this event I call an ajax-request, but before this ajax-request is completed , the jqgrid is automatically getting reload, and that is why I can not make the ajax-call successfully. Why this is happening and how to restrict jqgrid from reload.

Note: My jqgrid is getting reload by calling the url I have specified inside this grid. You can check the grid here how to load json in jqgrid

This is how I trap the paging Event:

$.subscribe('paging',function(event,data) 
 {
   var search_string=$("#searchString").val();
   var search_field=$("#searchField").val();        
$.ajax({
         url:"adminJsontable?searchString="+search_string,
         dataType:"json",
         success: function(jsondata,stat)
          {
            var mgrid = jQuery("#gridtable")[0];
            mgrid.addJSONData(jsondata);
          }
       });
  });

Update Section:

     $.subscribe('before',function(event,data) 
  {
    var grid = jQuery("#gridtable"); 
    grid.jqGrid('setGridParam',{url:"adminJsontable?searchString="+"neo"});
  });

This is how I am changing the url, but its not working. This way I can get any events like ready, complete,success. Please guide me now wht I have to do.

Note : I can use any methods or any events which is used in jqgrid but don't know how to make it.

回答1:

I think that there are just misunderstanding how jqGrid works. If the user choose another page jqGrid makes ajax request to the server per default. If you need to include additional custom filter in the request to the server you can use postData (see the answer). You can do for example the following

$("#grid").jqGrid({
    url: "adminJsontable",
    postData: {
        searchField: function () {
            return $("#searchField").val();
        },
        searchValue: function () {
            return $("#searchString").val();
        }
    },
    ... // other options which you use
});

I don't use Struts myself, but I am sure that you can rewrite yourself for the usage of inside Struts.

The above code will send additional parameters searchField and searchValue on every request to the server including paging sorting etc. So if the user enter some data in #searchField and #searchString then the data will be considered by your server code.

UPDATED: If you don't know how to specify postData in case of usage struts2-jquery-jqgrid plugin you must be still able to include some JavaScript file on the HTML page. If you includes

$.extend(true, $.jgrid.defaults, {
    postData: {
        searchField: function () {
            return $("#searchField").val();
        },
        searchValue: function () {
            return $("#searchString").val();
        }
    }
});

you will be able to redefine default value {} of postData parameter of jqGrid to the value which I suggested above. It's important that the above code should be executed before jaGrid is created. If you can execute JavaScript code only after the grid is created you can execute the following code

$.extend(true, $("#gridtable").jqGrid("getGridParam", "postData"),
    {
        searchField: function () {
            return $("#searchField").val();
        },
        searchValue: function () {
            return $("#searchString").val();
        }
    }
});