jqGrid Add Button and Modal

Question

When I click the cancel button in the add modal, I get the following error in the jquery.jqGrid.js file:

"0x800a138f - JavaScript runtime error: Unable to get property 'a' of undefined or null reference"

I only get this error in Internet Explorer, Chrome works fine.

The second issue I am having is that I'm calling the add modal from a button:

 <button name="addbutton" id="addbutton" class="add-new-row btn btn-success addbutton" style="float:right; margin-top:1%; margin-left:1%;">Add</button>

and then using the following code in the grid JS file:

 $(".addbutton").on("click", function () {
    $("#grid").editGridRow("new",
{
    // add options
    //2lines added by Ilango
    top: 50, left: 100, width: 500,
    addCaption: "Add record Dialog",
    addParams: { position: "afterSelected" },//, addRowParams: editOptions 
    zIndex: 100,
    url: "/Transactions/Create",
    closeOnEscape: true,
    closeAfterAdd: true,
    reloadAfterSubmit: true,

    afterComplete: function (response) {
        if (response.responseText) {
            $('#grid').trigger('reloadGrid')
            // alert(response.responseText);
            //window.location.reload();
            //reDefineColWidth();
            // $('#grid').trigger('reloadGrid')
            window.history.back();
        }

    },

    //submit on enter key
    onInitializeForm: function ($form) {
        $("td.DataTD>.FormElement", $form).keypress(function (e) {
            if (e.which === $.ui.keyCode.ENTER) {
                $("#sData", $form.next()).trigger("click");
                return false;
            }
        });
    },


    //adjust position of add form modal
    beforeShowForm: function (form) {
        //alert('adding' + "#editmod" + grdNames[0].id);
        //var dlgDiv = $("#editmod" + grdNames[0].id);
        var dlgDiv = $("#editmod" + $('#grid')[0].id);
        //var dlgDiv = jQuery("#editmodgrid");
        var parentDiv = dlgDiv.parent(); // div#gbox_list
        var dlgWidth = dlgDiv.width();
        var parentWidth = parentDiv.width();
        var dlgHeight = dlgDiv.height();
        var parentHeight = parentDiv.height();

        // Grabbed jQuery for grabbing offsets from here:
        //http://stackoverflow.com/questions/3170902/select-text-and-then-calculate-its-distance-from-top-with-javascript
        var parentTop = parentDiv.offset().top;
        var parentLeft = parentDiv.offset().left;


        // HINT: change parentWidth and parentHeight in case of the grid
        //       is larger as the browser window
        dlgDiv[0].style.top = Math.round(parentTop + (parentHeight - dlgHeight) / 2) + "px";
        //400 offset from left
        dlgDiv[0].style.left = Math.round(parentLeft + 500 + (parentWidth - dlgWidth) / 2) + "px";

    },

    afterShowForm: function (form) {
        //alert('adding' + "#editmod" + grdNames[0].id);
        //var dlgDiv = $("#editmod" + grdNames[0].id);
        var dlgDiv = $("#editmod" + $('#grid')[0].id);
        //var dlgDiv = jQuery("#editmodgrid");
        var parentDiv = dlgDiv.parent(); // div#gbox_list
        var dlgWidth = dlgDiv.width();
        var parentWidth = parentDiv.width();
        var dlgHeight = dlgDiv.height();
        var parentHeight = parentDiv.height();

        // Grabbed jQuery for grabbing offsets from here:
        //http://stackoverflow.com/questions/3170902/select-text-and-then-calculate-its-distance-from-top-with-javascript
        var parentTop = parentDiv.offset().top;
        var parentLeft = parentDiv.offset().left;


        // HINT: change parentWidth and parentHeight in case of the grid
        //       is larger as the browser window
        dlgDiv[0].style.top = Math.round(parentTop + (parentHeight - dlgHeight) / 2) + "px";
        //400 offset from left
        dlgDiv[0].style.left = Math.round(parentLeft + 500 + (parentWidth - dlgWidth) / 2) + "px";

    },
});
});

When I click the submit button, the record is submitted, but only with the default values I have setup for each column, not the values that I entered into the modal. I don't have this issue using the built in navigation add button.

Please help! I've spent many, many hours trying to figure this out.

EDIT:

Here is the block of code where the error occurs if(!h.a):

 close:function(s){var h=H[s];if(!h.a)return F;h.a=F;
 if(A[0]){A.pop();if(!A[0])L('unbind');}
 if(h.c.toTop&&h.o)$('#jqmP'+h.w[0]._jqm).after(h.w).remove();
 if(h.c.onHide)h.c.onHide(h);else{h.w.hide();if(h.o)h.o.remove();} return F;
 }