javascript - JqGrid tables reloading after editing and saving any row -

I have 4 jaggery tables in a JPC table and different Jason arrays pass for each grid table. The data I am displaying on the grid with the SQL terms differ from the table 1

I am using inline editing functionality for all the grids and when I edit and save the row from Table 1 , Then I want all the grids to be refresh so that if the row is already edited in the previous table, it should be automatically disappeared. I want to reload all the grid tables after editing any row in a table. I have written the following code:

  & lt; Table id = "jqgrid" & gt; & Lt; / Table & gt; & Lt; Div id = "pjqgrid" & gt; & Lt; / Div & gt; & Lt; Table id = "jqgrid1" & gt; & Lt; / Table & gt; & Lt; Div id = "pjqgrid1" & gt; & Lt; / Div & gt; & Lt; Table id = "jqgrid2" & gt; & Lt; / Table & gt; & Lt; Div id = "pjqgrid2" & gt; & Lt; / Div & gt; & Lt; Table id = "jqgrid3" & gt; & Lt; / Table & gt; & Lt; Div id = "pjqgrid3" & gt; & Lt; / Div & gt; & Lt; Script & gt; page Setup(); Var myEditOptions = {keys: true, after success: function (response) {// warning (JSON.stringify (feedback)); Var msg = response.responseText; Var n = msg.search ("renewed"); // warning (n); If (n> = 0) {$ ("internal"). Html ("& lt; div class = 'alert alert-in success fade' & gt; & gt; button class = 'close' data-discarded = 'alert' & gt; X & lt; / button & gt; Lt; i class = 'fa-fw fa fa-thumbs-up' & gt; & lt; / i & gt; "+ msg +" & lt; / div & gt; "); } And {$ ("internal."). Html ("& lt; div class = 'Warning warning - Fade in danger' & gt; & gt; button class = 'close' data-rejected = 'alert' & gt; X & lt; / button & gt; & Lt ; I class = 'fa-fw fa fa-thum-down' & gt; & lt; / i & gt; "+ msg +" & lt; / div & gt;); } $ ("# Jqgrid"). Trigger ('reload grid'); $ ("#Jqgrid1") trigger ('reloadGrid'). $ ("#Jqgrid2") trigger ('reloadGrid'). $ ("#Jqgrid3") trigger ('reloadGrid'). JQuery ("# ​​jqgrid") jqGrid ('resetSelection'). JQuery ("# ​​jqgrid1") jqGrid ('resetSelection'). JQuery ("# ​​jqgrid2") jqGrid ('resetSelection'). JQuery ("# ​​jqgrid3") jqGrid ('resetSelection'). Back true; }, Error: function (queued, feedback) {// warning (queued); }, Estratophon: function (relieved, response) {jQuery ("#Geekgrid"). JqGrid ('Reset Selection'); }}; & Lt; / Script & gt;  

You can reload the aftersavefunc To do this, you should do setTimeout inside the code .trigger ("reloadGrid") in addition to Code> Success. This will allow to finish the edit process before reloading:

  var myEditOptions = {keys: true, aftersavefunc: function () {setTimeout ( Function () {$ ("# Jqgrid, # jqgrid1, # ​​jqgrid2, # jqgrid3"). Triggers ("reload grid");}, 50); }, ...};