How do I find the Client ID of control within an ASP.NET GridView?

Question

I have a asp:GridView which contains a asp:TextBox within a TemplateField. I would like to obtain it's ID for use in javascript. Something like this:

<asp:TemplateField>
    <ItemTemplate>
        <asp:TextBox ID="textDateSent" runat="server" />
        <input type="button" value='Today' 
            onclick="setToday('<%# textDateSent.ClientID %>');" />
    </ItemTemplate>
</asp:TemplateField>

But when I compile, I get an error:

The name 'textDateSent' does not exist in the current context

Anybody know how to get the client ID of this TextBox?

score 32 · Accepted Answer · answered Jul 15 '09 at 02:13

32

Try this:

<asp:TemplateField>
    <ItemTemplate>
        <asp:TextBox ID="textDateSent" runat="server">
        </asp:TextBox>                      
       <input type="button" value='Today' onclick="setToday('<%# ((GridViewRow)Container).FindControl("textDateSent").ClientID %>');" /> 
    </ItemTemplate>
</asp:TemplateField>

answered Jul 15 '09 at 02:13

Chris Mullins

6,677
2
31
40

Hi `Chris` as per your I did the following in my code but unable to return value as needed `curTexbox.Attributes.Add("onBlur", "return multiplication('" + curTexbox.ClientID + "','" + curTexbox1.ClientID + "','<%# ((GridViewRow)Container).FindControl(txtAmount).ClientID %>')");` can you correct if I am wrong – Developer Apr 12 '12 at 12:05
User, nice username by are you missing quotes around txtAmount?, maybe it is a variable name though. The code is a little confusing because it is odd I see the data binding syntax combined with Attributes.Add which makes it look like something getting called from the row data bound event. If you are in a databinding event then to get the row container for the FindControl you can use e.Row.FindControl where e is the GridViewRowEventArgs passed into the method. – Chris Mullins Apr 12 '12 at 17:46
Parser Error Message: The server tag is not well formed. Arrghh how did you guys get this to work!? VS2005 asp.net2 here – Fandango68 Jun 10 '16 at 04:25
Not sure what the problem is, but I would start by checking that all quotes match, and that you have all the begin and end tags correct. – Chris Mullins Jun 14 '16 at 16:54

score 2 · Answer 2 · answered Jul 15 '09 at 03:27

2

Maybe you don't want to do it where you need the ClientID. Check out this post here where the controls in a row are referenced in a generic way.

answered Jul 15 '09 at 03:27

JBrooks

9,901
2
28
32

Andrew Siemer · Answer 3 · 2009-07-15T00:24:41.557

1

Change <%# textDateSent.ClientID %> to <%= textDateSent.ClientID %>.

Argh, you may need to use the OnDataBinding event of the grid view. Then put a literal control in your javascript. Then you can get the clientID of the text box and feed that into your literal control.

protected void GridViewName_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            //Create an instance of the datarow
            DataRowView rowData = (DataRowView)e.Row.DataItem;

            //locate your text box
            //locate your literal control
            //insert the clientID of the textbox into the literal control
        }
    }

Look here for a great detailed tutorial on working within this context.

edited Jul 15 '09 at 00:24

answered Jul 15 '09 at 00:12

Andrew Siemer

10,166
3
41
61

Boy...wouldn't direct communication with the question poster be so much easier! :P Check my update. – Andrew Siemer Jul 15 '09 at 00:21
1

up voted because it works, but I prefer Chris's answer because it's not done in code-behind. – Keltex Jul 15 '09 at 14:35

score 1 · Answer 4 · answered Aug 09 '13 at 11:38

You can get client id like this:

protected void Gv_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        string strClientID = ((TextBox)e.Row.FindControl("txtName")).ClientID;
    }
}

This will give unique client ID for each textbox in all rows.

Nathanael Stew Washington · Answer 5 · 2015-08-04T21:37:46.673

0

I just do this...

var tbl = document.getElementById('<%=GridView.ClientID%>');
var checkBox = tbl.rows[i].cells[11].getElementsByTagName("input")[0].id;

the cell should always be the same and it gets rendered into an input. You may have to change the number at the end if you have more then one input in that cell. This will give you the new clientid/id of the input object (checkbox or whatever)

edited Aug 04 '15 at 21:37

answered Jul 28 '15 at 15:19

Nathanael Stew Washington

51
6

1

Clear and simple. – Apr 07 '17 at 13:18

score 0 · Answer 6 · answered Sep 29 '17 at 13:31

This is what I did. In the aspx page I just passed the entire object to the javascript function, so I didn't even meed to client id. In my case the object was a drop down list in the EditItemTemplate of the GridView. I added an html onchange(this) event in the aspx code.

<asp:DropDownList ID="custReqRegionsDDL" runat="server" onchange='custReqRegionsDDLOnChange(this)'> </asp:DropDownList>

here is my javascript

function custReqRegionsDDLOnChange(myDDL)
    {
        alert('selected text=' + myDDL.options[myDDL.selectedIndex].text);

}

How do I find the Client ID of control within an ASP.NET GridView?

6 Answers6

Linked