jqGrid - edit data

I am quite new to jquery and jqgrid. I use ASP.NET WebForms. I am able to get some data prom server and show it in grid. I use PageMethods to get data from server. Usually my code is

function CreateGrid(){
    $("#sestGrid").jqGrid({
        datatype: GetData,
        //toolbar: [true, "top"],
        colNames: ['Name', 'Age'],
        colModel: [
            { name: 'Name', index: 'Name', width: 170, align: 'left',
              sortable: false, key: true },
            { name: 'Age', index: 'Age', width: 40, align: 'center',
              sortable: false, editable: true },
        ],
        ondblClickRow: function () {
            var row_id = $("#sestGrid").getGridParam('selrow');
            $('#sestGrid').editRow(row_id, true);
        }
    });
}

function GetData() {
    PageMethods.GetSestevalniStevecData(GotData);
}

function GotData (data) {
    $("#sestGrid").clearGridData(false);
    for (var j = 0; j <= data.length; j++)
        $("#sestGrid").jqGrid('addRowData', j + 1, data[j]);
}

So, now I would like to edit some data and post it to server. How can I do that using PageMethods? Should I use any other approach?

And one more thing. I checked the demos http://trirand.com/blog/jqgrid/jqgrid.html and in all edit examples you are able to edit only one row and then you have to save c开发者_StackOverflowhanges… Is it possible to edit more than one row and save all changes in one step?

Thanks all.

jqGrid is designed to be used together with ajax services. So if the user change the data of some row then the changes will be send to the server: to the URL which you configure through jqGrid parameter editurl. So the easiest way to implement row editing will be to include an ASMX web-service or a WCF service in you web site. It is not important whether you use ASP.NET WebForms, ASP.NET MVC or just pure HTML for your pages. So just choose the technology which you prefer and add the corresponding page to your site.

The ASMX or WCF should has a method with the signature like

public string MyDataEdit (string Age, string oper, string id)

(see this old answer for more information). The method should return the id of the new added item (the Name in your case) in case of Add operation.

One more small remark. You can change the definition of the ondblClickRow function from function() to function(row_id) and remove the line used getGridParam('selrow').

I used your example and changed it a bit:

ondblClickRow: function (rowid) {
if (rowid && rowid != lastsel) {
    changedRows.push(rowid); //keep row id
    jQuery('#jqgrid').editRow(rowid, true);
}
}

Under the save button click event:

$.each(changedRows, function () {
    var row = $("#jqgrid").getRowData(this);
    var Id = row['ID'];
    var price = $(row['Price']).val(); //this is an input type
});

HTH someone :)