1

I have couple of jqgrids on a page..Now I want to reload both the jqgrids after i update a record in any of them.

Here is my body..

    <div style="position: relative; top: 40px; width:50%">
        <table id="list"><tr><td></td></tr></table> 
        <div id="pager"></div> 
    </div>

    <div style="position: relative; top: -250px; left:50%;">
        <table id="list1"><tr><td></td></tr></table> 
        <div id="pager1"></div> 
    </div>

and Here is the script for after submit function of first jqgrid...

afterSubmit: function (response, postdata)

                        {

                            if (response.responseText === "OK")
                            {
                                alert("Update is succefully");

                                alert(this);
                                $(this).jqGrid("setGridParam", {datatype: 'json'});
                                return [true, "", ""];

                                alert("#list1");
                                $("#list1").jqGrid("setGridParam", {datatype: 'json'});
                                return [true, "", ""];
                                //   $(this).trigger('reloadGrid');

                            }
                            else {
                                alert("Update failed");
                                return [true, "", ""];
                            }
                        }

Now using this code my first jqgrid does get reloaded after updating data and shows updated data in that jqgrid, However second jqgrid which has id #list1 doesn't get reloaded/refreshed.How do I Achieve this?

Saurabh507
  • 33
  • 6
  • now here when i use alert(this) it shows [object HtmlTableElement] ..however for alert("#list1") it shows [object Object] – Saurabh507 Apr 05 '16 at 16:15

1 Answers1

1

It's unclear which changes exactly you mean. If you use free jqGrid fork, then the recommended way to reload the grid from the server, if it has loadonce: true option, would be to use .trigger("reloadGrid", {fromServer: true}) or $("#list").trigger("reloadGrid", [{fromServer: true, current: true, page: 1}]); (see the answer or this one). Thus you can do the following:

$(".ui-jqgrid-btable").trigger("reloadGrid", {fromServer: true});

If you need to trigger reloading of the grid inside of some callback like afterSubmit then I recommend you to wrap the above code in the setTimeout to allow to finish processing of the afterSubmit before reloading of the grid:

afterSubmit: function () {
    setTimeout(function () {
        $(".ui-jqgrid-btable").trigger("reloadGrid", {fromServer: true});
    }, 50);
    return [true, "", ""];
}
Community
  • 1
  • 1
Oleg
  • 220,925
  • 34
  • 403
  • 798
  • yeah i'm using free jqGrid and it has loadonce: true but this $("#list1").trigger("reloadGrid", {fromServer: true}); doesn't work. It's just the second jqgrid that doesnt get reloaded my first grid gets reloaded with this code... $(this).jqGrid("setGridParam", {datatype: 'json'}); return [true, "", ""]; – Saurabh507 Apr 05 '16 at 16:27
  • @Saurabh507: Are you shure that you use free jqGrid? Which version of free jqGrid you use? (you need open `jquery.jqgrid.src.js` or `jquery.jqgrid.min.js` and to see in the comment at the beginning the file: **jqGrid 4.13.1 - free jqGrid**). I recommend to load the last version from GitHub [here](https://github.com/free-jqgrid/jqGrid) or to use it from CDN: see [the wiki article](https://github.com/free-jqgrid/jqGrid/wiki/Access-free-jqGrid-from-different-CDNs). – Oleg Apr 05 '16 at 16:54