jQuery Grid Plugin - jqGrid

finally i am able to do it.

here is javascript code:

jQuery("#list5").jqGrid({
                height: 550,
                width: 900,
                data: mydata,
                datatype: "local",
                colNames: [...],
                colModel: [...],
                rowNum: 10,
                rowList: [10, 20, 30],
                //                pager: '#pager5',
                sortname: 'AssessId',
                viewrecords: true,
                sortorder: "asc",
                caption: "GAAT Assessments",
                multiselect: false,
                subGrid: true,
                subGridRowExpanded: function (subgrid_id, row_id) {
                   
                    var CTdata = jQuery("#list5").getRowData(row_id);
                  
                    var subgrid_table_id, pager_id;
                    subgrid_table_id = subgrid_id + "_t";
                    pager_id = "p_" + subgrid_table_id;
                    $("#" + subgrid_id).html("<table id='" + subgrid_table_id + "' class='scroll'></table><div id='" + pager_id + "' class='scroll'></div>");
                    jQuery("#" + subgrid_table_id).jqGrid({
                        data: subgridData, // subgrid data
                        datatype: "local",

                        colNames: [...],
                        colModel: [...],
                        rowNum: 20,
                        pager: pager_id,
                        sortname: 'SLNo',
                        sortorder: "asc",
                        height: '100%',
                        editurl: '...' + row_id //The Add/Edit function call
                    });
                   // jQuery("#" + subgrid_table_id).addRowData("1", null);
                    jQuery("#" + subgrid_table_id).jqGrid('navGrid', "#" + pager_id, {
                        search: false, //title set for hover over display
                        edit: true, edittitle: "Edit Comment", width: 200,
                        add: true, addtitle: "Add Comment", width: 200,
                        del: true, deltitle: "Delete Comment"
                    },
                    // Edit Options. save key parameter will keybind the Enter key to submit.
                    {editCaption: "Edit Comment", edittext: "Edit", closeOnEscape: true, closeAfterEdit: true, savekey: [true, 13], errorTextFormat: commonError, width: "500"
                        , reloadAfterSubmit: true, bottominfo: "Fields marked with (*) are required", top: "60", left: "5", right: "5",
                        onclickSubmit: function (response, postdata, formid) {
                            var su = jQuery("#" + subgrid_table_id).getGridParam("selrow");
                            EditComment(su, postdata, CTdata);
                        }

                    },
                    { addCaption: "Add Comment", closeOnEscape: true, closeAfterAdd: true, savekey: [true, 13], errorTextFormat: commonError, width: "500"
                        , reloadAfterSubmit: true, bottominfo: "Fields marked with (*) are required", top: "60", left: "5", right: "5",
                        onclickSubmit: function (response, postdata, formid) {
                            var su = jQuery("#" + subgrid_table_id).getGridParam("selrow");
                            AddComment(su, postdata, CTdata);
                        }
                    },
                        //Add Options
                    {url: "", caption: "Delete Comment", closeOnEscape: true, errorTextFormat: commonError, top: "60", left: "70",
                    reloadAfterSubmit: true,
                    onclickSubmit: function (response, postdata, formid) {
                        if (CTdata != null && postdata != null) {
                            DeleteComment(postdata, CTdata);
                        }
                    }
                } //Delete Options);
            )

                },
                subGridRowColapsed: function (subgrid_id, row_id) {
                    // this function is called before removing the data
                    //var subgrid_table_id;
                    //subgrid_table_id = subgrid_id+"_t";
                    //jQuery("#"+subgrid_table_id).remove();
                }

            });         //.navGrid("#pager5", { edit: false, add: false, del: false });
            jQuery("#pager5").jqGrid('navGrid', '#pager5', { del: false, add: false, edit: false }, {}, {}, {}, { multipleSearch: true });
}

function commonError(data) {
                return "Error Occured during Operation. Please try again";
            }

            function EditComment(su, postdata, CTdata) {
                alert(su);
            }

    function AddComment(su, postdata, CTdata) {
        alert(postdata);
    }

    function DeleteComment(postdata, CTdata) {
        alert(postdata);
    }