[Solved] Get row index for fireCommand in JavaScript

[Kerry]

What I have is a radgrid, wonderfully populated with data. On each row of this grid, I have three buttons (inherited from RadButtons). One of these buttons does not need any confirmation. Two of them, however, need confirmation before firing ItemCommand.

Part of the issue is a certain convoluted way the button is implemented, it requires me to use fireCommand from JavaScript. However, I need to obtain the row index to pass as a parameter to the fireCommand function.

How do I obtain the row index of the row containing my button for use in JavaScript?

01.function OnClientClickingDelete(sender, args) {
02.    var r = confirm('This action will delete the selected employee. Are you sure?');
03.
04.    if (r == true) {
05.        var masterTable = $find('<%= rgEnrolled.ClientID %>').get_masterTableView();
06.        masterTable.fireCommand('Delete', ****RowIndex****);
07.    }
08.}
09.
10.function OnClientClickingRestore(sender, args) {
11.    var r = confirm('This action will restore the selected employee. Are you sure?');
12.
13.    if (r == true) {
14.        var masterTable = $find('<%= rgEnrolled.ClientID %>').get_masterTableView();
15.        masterTable.fireCommand('Restore', ****RowIndex****);
16.    }
17.}

[Princy]

Hi Kerry,

Please try the following code snippet to get the rowindex:

JS:

var rowIndex = sender.get_element().parentNode.parentNode.rowIndex - 1;

Thanks,
Princy

[Kerry]

That was REALLY, REALLY close, and thank you very much, Princy.

Turns out, I has to shift _3_ instead of 1. So, my final code that worked is:

01.function OnClientClickingDelete(sender, args) {
02.    var r = confirm('This action will delete the selected employee. Are you sure?');
03.
04.    if (r == true) {
05.        var masterTable = $find('<%= rgEnrolled.ClientID %>').get_masterTableView();
06.        var rowIndex = sender.get_element().parentNode.parentNode.rowIndex - 3;
07.        masterTable.fireCommand('Delete', rowIndex);
08.    }
09.}
10.
11.function OnClientClickingRestore(sender, args) {
12.    var r = confirm('This action will restore the selected employee. Are you sure?');
13.
14.    if (r == true) {
15.        var masterTable = $find('<%= rgEnrolled.ClientID %>').get_masterTableView();
16.        var rowIndex = sender.get_element().parentNode.parentNode.rowIndex - 3;
17.        masterTable.fireCommand('Restore', rowIndex);
18.    }
19.}

[Kerry]

Well, it really was close... Seems to work okay with the 'Delete' command, but my custom 'Restore' command simply returned the first row of the datatable.

I ended up using the 'Update' command and tinkering with the resulting GridEditFormItem. *sigh*

Once again, thank you, Princy. Without your help, I would have been floundering.

SO... My final WORKING code is as follows(EditUrl is from DNN, MyData is our data layer wrapper):

JavaScript:

01.function OnClientClickingDelete(sender, args) {
02.    var r = confirm('This action will delete the selected employee. Are you sure?');
03.
04.    if (r == true) {
05.        var masterTable = $find('<%= rgEnrolled.ClientID %>').get_masterTableView();
06.        var rowIndex = sender.get_element().parentNode.parentNode.rowIndex - 3;
07.        masterTable.fireCommand('Delete', rowIndex);
08.    }
09.}
10.
11.function OnClientClickingRestore(sender, args) {
12.    var r = confirm('This action will restore the selected employee. Are you sure?');
13.
14.    if (r == true) {
15.        var masterTable = $find('<%= rgEnrolled.ClientID %>').get_masterTableView();
16.        var rowIndex = sender.get_element().parentNode.parentNode.rowIndex - 3;
17.        masterTable.fireCommand('Update', rowIndex);
18.    }
19.}

VB:

01.Protected Sub rgEnrolled_ItemCommand(sender As Object, e As Telerik.Web.UI.GridCommandEventArgs) Handles rgEnrolled.ItemCommand
02.    If TypeOf e.Item Is GridDataItem Then
03.        Dim strUserID As String = CType(e.Item, GridDataItem).GetDataKeyValue("UserID")
04.
05.        Select Case e.CommandName
06.            Case "Edit"
07.                Response.Redirect(EditUrl("TraineeID", strUserID, "EditTrainee", "TID=" & ddlEnrolledTrack.SelectedValue))
08.            Case "Delete"
09.                MyData.ProcNonQuery("InactivateTrainee", "@UserID", strUserID, "@TrackID", ddlEnrolledTrack.SelectedValue)
10.                rgEnrolled.Rebind()
11.        End Select
12.    ElseIf TypeOf e.Item Is GridEditFormItem Then
13.        Dim strUserID As String = CType(e.Item, GridEditFormItem).OwnerTableView.DataKeyValues(e.Item.ItemIndex)("UserID")
14.        MyData.ProcNonQuery("ActivateTrainee", "@UserID", strUserID, "@TrackID", ddlEnrolledTrack.SelectedValue)
15.        rgEnrolled.Rebind()
16.    End If
17.End Sub

[Eyup]

Hi Kerry,

I'm glad you have managed to find a viable solution for your scenario.

In addition, you can check the approach suggested in the following post to achieve the requested functionality:
http://www.telerik.com/forums/passing-arguments-to-client-events#QkAxV87iOUalEx4wNaumeA

Also, I am attaching a sample RadGrid web site to demonstrate two different ways of implementing record delete confirmation.

Hope this helps.

Regards,
Eyup
Telerik