Struts2 jqGrid Bind afterclickPgButtons to Edit Dialog

Question

I have a struts2-jquery jqGrid page with a grid that uses the event dialog boxes. I'm trying to bind the event afterclickPgButtons to the edit dialog. I can bind events to the entire grid (gridTable), but I'm having issues binding the event to the dialog box. I want to modify the contents of elements AFTER the edit dialog info changes when using the next/prev button inside the edit dialog.

$("#editmodgridtable").bind("afterclickPgButtons", function(whichbutton, formid, rowid){
    alert("Hey!");
});

I'm trying to run the below inside the loadComplete and bind to jqGridAddEditAfterShowForm thinking I need to do the final bind after the page loads and after the form is displayed.

$.subscribe('loadComplete', function(event, data) {
    $("#gridtable").bind("jqGridAddEditAfterShowForm", function (e, $form, oper) {
        $("#editmodgridtable").bind("afterclickPgButtons", function(whichbutton, formid, rowid){
    alert("Hey!");
        });
     }
}

However, the code above seems to be cumbersome and the bind to afterclickPgButtons does not work. How do I get the afterClickPgButtons to workAny help is greatly appreciated.

Answer 1

I'm not sure which is the id of the grid which you use: "editmodgridtable" or "gridtable". You should bind "jqGridAddEditAfterShowForm", "jqGridAddEditAfterClickPgButtons" or "jqGridLoadComplete" directly. It's event not important when you make the binding. The table of the main grid (<table id="gridtable"></table>) should just exist before binding. So the correct code could be very simple

var $grid = $("#gridtable");

$grid.bind("jqGridLoadComplete", function (e, data) {
    alert("In jqGridLoadComplete");
});

$grid.bind("jqGridAddEditAfterShowForm", function (e, $form, oper) {
    alert("In jqGridAddEditAfterShowForm");
});

$grid.bind("jqGridAddEditAfterClickPgButtons", function (e, whichButton, $form, rowid) {
    alert(whichButton + " " + rowid);
});