Custom delete button in jqGrid

Herb Caudill picture Herb Caudill · Mar 2, 2010 · Viewed 19k times · Source

I'd like to implement my own delete functionality in jqGrid. I'm currently using the built-in UI (select row, press trashcan button in footer, confirm) but I'd prefer to have a delete button in each row and implement my own UI for confirmation.

I don't see anything in the API that allows me to fire off a delete to the server - just delRowData, which deletes it on the client. Can this be done?

(I'm using the ASP.NET component, FWIW).

Answer

Erik picture Erik · Mar 2, 2010

There is no part of the basic jqGrid component that handles the server side deletion - even if you use the built in delete, its not removing it server side for you, you have to handle that yourself. But here's how to set it up so your script is called when someone clicks your custom delete button:

// your custom button is #bDelete
$("#bDelete").click(function(){ 

    // Get the currently selected row
    toDelete = $("#mygrid").jqGrid('getGridParam','selrow');

    // You'll get a pop-up confirmation dialog, and if you say yes,
    // it will call "delete.php" on your server.
    $("#mygrid").jqGrid(
        'delGridRow',
        toDelete,
          { url: 'delete.php', 
            reloadAfterSubmit:false}
    );
});

The following information is past via POST to your delete URL

Array
(
    [oper] => del
    [id] => 88
)

Where id is obviously the id you passed into the function in this case, the value of toDelete.

I actually just did this for my own project, in response to your question - although I had a vague idea of how to do it before I saw the question. So ... thanks for making me get to it!