views:

60

answers:

4

The following code does not work. The markup is in a User Control and I suppose that's why ClientID returns the wrong prefix for the TextBox id.

Markup:

<INPUT id="txtName" runat="server" maxlength="50" style="WIDTH:100px">
<INPUT type="button" value="Find Your Doctor" id="btnFind" runat="server"
      style="MARGIN-LEFT:10px;WIDTH:130px">

Code-Behind:

btnFind.Attributes.Add("onClick",string.Format("DoctorLink
        ('{0}',document.getElementById('{1}').value,{2});",
        row["ZipCode"],
        txtName.ClientID));

Results in browser:

<input name="DoctorsMainArea1$ctl01$txtName" type="text"
   id="DoctorsMainArea1_ctl01_txtName" maxlength="50" style="WIDTH:100px" />

<input name="DoctorsMainArea1$ctl01$btnFind" type="button" 
   id="DoctorsMainArea1_ctl01_btnFind" value="Find Your Doctor" style="MARGIN-
   LEFT:10px;WIDTH:130px" onClick="PrepareDoctorLink('90210',
   document.getElementById('DoctorsMainArea1_ctl00_txtName').value);" />

As you can see, the parameter for the JavaScript call is DoctorsMainArea1_ctl00_txtName, but the actual id of the input element is DoctorsMainArea1_ctl01_txtName.

Any idea how to fix this? jQuery? I am not so much interested in an explanation of what's going on (maybe there is another control on this page that is interfering), but a more robust way to solve the problem.

A: 

A fast solution:

btnFind.Attributes.Add("onClick",string.Format("DoctorLink
        ('{0}',document.getElementById('{1}').value,{2});",
        row["ZipCode"],
        "DoctorsMainArea1_ctl01_" + txtName.ClientID));

This happens because you have a content placeholder in your page somewhere.

Leniel Macaferi
Fast maybe, but not very robust :-)
cdonner
Not robust, you're right. If you were using ASP.NET 4 you'd have a better support for Client IDs. Things changed for better. Thanks God!
Leniel Macaferi
A: 

another solution: html tag:

<input type="text" name="txtName" id="txtName" />

code-bind:

string txtName_value = Request.Forms["txtName"];

and you can get the value

just use the html control.

Tim Li
ps: don't give the repeat name in the page, it will become a string that like "value1,value2"
Tim Li
Like I said, this is a user control and your solution does not work for multiple instances of the control on one page. Since in this case there won't be more than one, and if nothing better comes up, I may still use your suggestion (until it breaks the page the next time). I still believe that this can be done more elegantly with jQuery.
cdonner
+1  A: 

I don't know which asp.net version you are using but in 4.0 you can declare inside any server control ClientIDMode="static" and it will give you the exact id in browser.

Example:

<asp:Textbox id="txtName" runat="server" ClientIdMode="static"/>

Others are predictable, inherit and it can be used with ClientIdRowsuffix.Can be used at page level and even on master pages and even in web.config file.

Example on web.config file:

<system.web>
<Pages clientIDMode="predictable"/>
other system web properties
</system.web>

Watched Craig shoemaker's Video at tekpub, you can also read more about it at Rick's bloglink text. It's pretty cool tho.

fzshah76
We are on the 3.5 framework
cdonner
+1  A: 

You should try moving the code that adds the onclick attribute to the button in the PreRender event (or OnPreRender override) in your page or user-control. That should probably get the ClientID right.

VinayC
It was in the Page_Init event. We moved it into the page load event and it works fine.
cdonner