How do i use a custom button to send to the JQGrid's editurl?

Question

I have the below custom button added to my navigation pager, but i want it to look at what i multi selected and send it to the JQGrid's editurl for processing which is a ASHX.CS page But i can't make sense of the documentation when it comes to custom button

I can get it call a local function with onClickButton: customButtonClicked but it doesn't send the data like the EDIT button does

In the end what i want to do it select multiple rows and press a button on the navbar and approve all the selected records

        // add first custom button
        $('#jQGrid').navButtonAdd('#jQGridPager',
            {
            buttonicon: "ui-icon-mail-closed",
            title: "Send Mail",
            caption: "Send Mail",
            position: "last",
            editData: {
                WrkId: function () {
                    var sel_id = $('#jQGrid').jqGrid('getGridParam', 'selarrrow');
                    var value = "";
                    for (var a = 0; a < sel_id.length; a++) {
                        value = value + $('#jQGrid').jqGrid('getCell', sel_id[a], 'wrkid') + ',';
                    }
                    return value;
                },
                CurrentUser: function () {
                    return '<% =System.Web.HttpContext.Current.User.Identity.Name %>';
                }
            },
            afterSubmit: function (response, postdata) {
                if (response.responseText == "") {
                    $("#jQGrid").trigger("reloadGrid", [{ current: true }]);
                    return [false, response.responseText]
                }
                else {
                    $(this).jqGrid('setGridParam', { datatype: 'json' }).trigger('reloadGrid')
                    return [true, response.responseText]
                }
            }
            }
        );

Answer 1

using a few different words (how to manually post data to server json) i was able to find a snippet of an ajax code that made more sense (i'm sure i came across this before but as someone who has no jquery experience i didn't recognize it)

but the below sends to the C# handler page the data in a JSON string that was processable, had to use dynamic to read it in but it worked, couldn't get it to not return an error even though there was no error, so i used the complete: instead of success: and then called the trigger to reload the JQGrid

Final Code:

$('#jQGrid').navButtonAdd('#jQGridPager',
            {
                buttonicon: "ui-icon-check",
                title: "Approve all selected entries",
                caption: "Approve",
                position: "last",
                onClickButton: function () {
                    var sel_id = $('#jQGrid').jqGrid('getGridParam', 'selarrrow');
                    var value = "";
                    for (var a = 0; a < sel_id.length; a++) {
                        value = value + $('#jQGrid').jqGrid('getCell', sel_id[a], 'wrkid') + ',';
                    };
                    $.ajax({
                        type: "POST",
                        url: "AdministrationHandler.ashx?oper=approve",
                        data: JSON.stringify({
                            WrkId: value,
                            CurrentUser: "<% =System.Web.HttpContext.Current.User.Identity.Name %>"
                        }),
                        dataType: "json",
                        contentType: "application/json; charsset=utf-8",
                        complete: function (xhr, x) {
                            if (xhr.responseText.toUpperCase().indexOf("SUCCESS") >= 0) {
                                alert('Success!\n' + xhr.responseText);
                            }
                            else {
                                alert('Failed!\n' + xhr.responseText + '\n' + x);
                            };
                            $("#jQGrid").jqGrid('setGridParam', { datatype: 'json' }).trigger('reloadGrid');
                        }
                    })
                }
            });

C# Code

try
{
    String postData = new System.IO.StreamReader(context.Request.InputStream).ReadToEnd();
    var data = JsonConvert.DeserializeObject<dynamic>(postData);
    Approve(data.WrkId.ToString(), data.CurrentUser.ToString());
    strResponse = "Employee records successfully approved";
}
catch
{
    strResponse = "Employee records not approved";
}
context.Response.Write(strResponse);