jqGrid inline delete: selected row "selrow" is incorrect

Question

I have a in-line delete button, I want to append more data to the delete message pop-up like this: "Delete selected row with code = 7 ?"

I'm using the following in the delOptions:

beforeShowForm: function ($form) {
var sel_id = $("#list").jqGrid('getGridParam', 'selrow');
$("td.delmsg", $form[0]).html("Delete record with <b>code=" + $("#list").jqGrid('getCell', sel_id, 'cd') + "</b>?");}

The problem is If I click on the delete button without first clicking on any part of the row, the selrow is either null or it gets the previously selected row not the currently selected!

How do I make the row selected when clicking on the trash bin icon?

Any help is appreciated

Decorous

Can you show us the code you are using to create the delete button? – Refract

Answer 1

I suppose that you use the example which I posted in the old answer. It was written in case of usage of the Delete button (the part of form editing) from navigator bar.

There are one hidden row in the Delete dialog which could help you. Try this one

beforeShowForm: function ($form) {
    // get comma separated list of ids of rows which will be delete
    // in case of multiselect:true grid or just id of the row.
    // In the code below we suppose that single row selection are used
    var idOfDeletedRow = $("#DelData>td:nth-child(1)").text();
    $form.find("td.delmsg").eq(0)
        .html("Delete record with <b>code=" +
            $(this).jqGrid('getCell', idOfDeletedRow, 'cd') + "</b>?");
    // REMARK: in old versions of jqGrid you can't use $(this) and
    //         will have to use something like $("#list")
}

Postmark

Thanks Oleg, that took care of it. – Decorous

While we're at it, is there a way to center the delete dialog in the window? I was able to center it using #211217 but for long grids it always snaps to the top of the window – Decorous

@AE: There are many ways how you can implement this. Look at the demo from the answer for example. Another possibility to center the dialog you can see on another demo from the answer. One more way how to place the div (dialog) in the center of the visible part of the grid you will find here. You can use the same idea for any dialog. – Postmark

I tried those solutions, it's centered already but it shows the dialog then the viewport snaps to the top of the window !! – Decorous

@AE: Is it not what you need? You want that if the grid is long (have many rows or many columns) the dialog will appears so that the user see it. Is it not so? – Postmark

the dialog shows then the page is scrolled to the top right away, so the dialog disappears from the viewport, the user has to scroll down to see it – Decorous

@AE: I posted you many different examples. Everyone has some advantages and disadvantages. The first one which I posted you was the demo from the answer. Try "Delete" button on the demo. The demo shows the dialog close to the selected row which need be deleted. Other demos which another source as the position of the dialog. So you should just decide what you want and either choose one from the suggested ways or make simple modification of one from the demos. – Postmark

@AE: If you would use contextMenu : see the demo from the answer then the user will don't need to scroll to the navigator bar to click "Delete" button. In the case displaying of the "Delete" dialog close to selected row would be the best way. – Postmark

really appreciate your patience, here's a screenshot of what is happening: screenr.com/16d8 – Decorous

@AE: From the screen I see that you use formatter: 'actions' probably. In the case you should use formatoptions: {delOptions: {afterShowForm: function($form) {...}}} – Postmark

@AE: If you will have implementation problems with position of Delete form in formatter: 'actions' you should post new question and I will answer it (I will create a demo for you too). – Postmark

I think there may be a bug in the actions formatter, if I click on any actions cell (outside the icons), it scrolls to the top of the grid – Decorous

@AE: I think that you use it in a wrong way. Look at the demo. It works. I think the main problem is that you don't post more full code which you use. Moreover you should ask separate questions to separate problems. – Postmark

here's the new questions with the code used:<br>#10082213 – Decorous