Accessing Rows in multiple RADGrids

[George]

Hi, 

I am maintaining an existing app and have 3 RADGRIDs which are identical and used for 3 types of transactions. I have several columns with a button at the end, with a row added to the bottom to have comments on the 2nd line of each transaction.

The button is to add comments and I want to get the current comments and put this into the dialog box when the add btn is clicked.

The problem I am having is that I dont know how to access the correct Row (the following example just gives me the 1st row and not the ROW whos add button was clicked and from which RADGRID.

Here is the code I found on you site which gives me the comments for the first transaction only and the radgrids after thet.

Thanks, George.

var grid = $find("RadGrid1").get_element();
var CommentsElement = $telerik.findElement(grid, "CommentsField");
if (CommentsElement)
$("#txtAddComment").val(CommentsElement.outerText); 



<telerik:RadGrid runat="server" ID="RadGrid1" HeaderStyle-HorizontalAlign="Left" 
<MasterTableView>
    <Columns>
        <telerik:GridTemplateColumn HeaderText="ID" ItemStyle-Width="200px" Display="false">
            <ItemTemplate>
                <asp:Label runat="server" ID="ID" Text='<%# DataBinder.Eval(Container.DataItem, "ID")%>' />
            </ItemTemplate>
        </telerik:GridTemplateColumn>
        <telerik:GridTemplateColumn HeaderText="Name" ItemStyle-Width="150px">
             <ItemTemplate>
                  <asp:Label runat="server" ID="NAME" Text='<%# DataBinder.Eval(Container.DataItem, "NAME")%>' />
             </ItemTemplate>
        </telerik:GridTemplateColumn>
        <telerik:GridTemplateColumn HeaderText="Add Comments">
             <ItemTemplate>
                <telerik:RadButton runat="server" Text="Add" ID="AddCommentBtn" OnClientClicked="AddCommentBtn_Clicked" AutoPostBack="false"  />
           </ItemTemplate>
        </telerik:GridTemplateColumn>
    </Columns>
    <DetailItemTemplate>
        <asp:Table ID="ColumnRow" runat="server">
            <asp:TableRow>
                <asp:TableCell>
                      <asp:Label runat="server" ID="CommentsField" Text='<%# DataBinder.Eval(Container.DataItem, "COMMENTS")%>' 
                </asp:TableCell>
            </asp:TableRow>
        </asp:Table>
    </DetailItemTemplate>
</MasterTableView>
</telerik:RadGrid>


<telerik:RadGrid runat="server" ID="RadGrid2" HeaderStyle-HorizontalAlign="Left" 
<MasterTableView>
    <Columns>
        <telerik:GridTemplateColumn HeaderText="ID" ItemStyle-Width="200px" Display="false">
            <ItemTemplate>
                <asp:Label runat="server" ID="ID" Text='<%# DataBinder.Eval(Container.DataItem, "ID")%>' />
            </ItemTemplate>
        </telerik:GridTemplateColumn>
        <telerik:GridTemplateColumn HeaderText="Name" ItemStyle-Width="150px">
             <ItemTemplate>
                  <asp:Label runat="server" ID="NAME" Text='<%# DataBinder.Eval(Container.DataItem, "NAME")%>' />
             </ItemTemplate>
        </telerik:GridTemplateColumn>
        <telerik:GridTemplateColumn HeaderText="Add Comments">
             <ItemTemplate>
                <telerik:RadButton runat="server" Text="Add" ID="AddCommentBtn2" OnClientClicked="AddCommentBtn_Clicked" AutoPostBack="false"  />
           </ItemTemplate>
        </telerik:GridTemplateColumn>
    </Columns>
    <DetailItemTemplate>
        <asp:Table ID="ColumnRow" runat="server">
            <asp:TableRow>
                <asp:TableCell>
                      <asp:Label runat="server" ID="CommentsField" Text='<%# DataBinder.Eval(Container.DataItem, "COMMENTS")%>' 
                </asp:TableCell>
            </asp:TableRow>
        </asp:Table>
    </DetailItemTemplate>
</MasterTableView>
</telerik:RadGrid>

[Eyup]

Hello George,

You can use the following approach to achieve the requested functionality:

<ItemTemplate>
    <telerik:RadButton runat="server" Text="Add" ID="AddCommentBtn" AutoPostBack="false"
        OnClientClicked='<%# string.Format("function (s,a){{addComment(s,a,\"{0}\",\"{1}\");}}",
        Container.ItemIndex, Container.OwnerTableView.ClientID) %>' />
</ItemTemplate>

JavaScript:

function addComment(sender, args, index, tableViewID) {
    var tableView = $find(tableViewID);
    var item = tableView.get_dataItems()[index];
    var detailItem = $(item.get_element()).next()[0];
    var label = $telerik.findElement(detailItem, "CommentsField");
    alert($(label).text());
}

Hope this helps. Please give it a try and let me know if it works for you.

Regards,
Eyup
Telerik