Question

I’ve been trawling across the web for answers, and maybe it’s a case of it being more complicated than I expect (or I just don’t understand the solutions), but I am looking for a way to simply delete a selected row from my jqgrid by clicking the trash icon.

Currently my grid is being populated with Linq to SQL data.
Here is my grid:

jQuery("#grid").jqGrid({
                     url: '<%= ResolveUrl("~/Home/GetData") %>',
                     datatype: "json",
                     mtype: 'GET',
                     postData: { DDLid: function () { return jQuery("#DDL option:selected").val(); } },
                     colNames: ['Col1', 'Col2'],
                     colModel: [
                        { name: 'Col1', index: 'Col1', width: 200, editable: false },
                        { name: 'Col2', index: 'Col2', width: 200, editable: false }
                        ],
                     jsonReader: {
                         repeatitems: false
                     },
                     rowNum: 10,
                     pager: jQuery('#gridpager'),
                     sortname: 'Type',
                     viewrecords: true,
                     sortorder: "asc",
                     caption: "Table"
                 }).navGrid('#gridpager', { del: true, add: false, edit: false, search: false }, {}, {}, {url: "Delete"});

Now the ‘id’ in post data is NOT the primary key in this table – I just need it to help populate the grid.
What I would like to get is the selected row id and pass it to the Delete method, but I can’t find any way to do that.

I have tried using jQuery("#grid").getGridParam('selrow') in the postData but it always returns null.

Any help would be greatly appreciated.

Here is my delete method, for reference:

[AcceptVerbs(HttpVerbs.Post)]
    public ActionResult Delete(int DDLid) 
    {
        int row = Convert.ToInt32(/*I NEED THIS ID*/);
        var query = from x in _ctx.DataTable
                    where ((x.id == row))
                    select x;
        _ctx.DataTable.DeleteOnSubmit(query.Single());
        _ctx.SubmitChanges();
        return Json(true);
    }

This method is called and is fine, but I am getting the wrong id. I need the selected row’s id. This breaks because the DDLid returns more than one row (since it is used to populate the grid).

I hope that makes sense.

Answer 1

I discovered where I would pass the selected index (but then I realised I was looking for the primary key, rather than selected index, but it is the same result regardless)

I needed to add this to my navGrid:

 {url: "Delete", mtype: "POST", reloadAfterSubmit: true, 
       serializeDelData: function (postdata) {
                         var selectedrowindex = jQuery("#grid").jqGrid('getGridParam', 'selrow');
                         var dataFromCellByColumnIndex = jQuery('#grid').jqGrid ('getCell', selectedrowindex , 1); 
                         return {DDLid: postdata.id, name: dataFromCellByColumnIndex};
       }
 });

So this passes a column value to my delete method as well as the DDLid, but I could easily swap dataFromCellByColumnIndex with selectedrowindex.