Get at the ASP.NET Ajax control name with the BehaviorID property

If you have ever worked with ASP.NET and binding data to a repeater control or placing content inside master pages, you're probably familiar with how ASP.NET renames the control to make it unique.  This makes web developers have many headaches as they try to get to those controls from javascript.  Here's a scenario I was recently faced with:  I had a web control using some controls from the ASP.NET Ajax control toolkit, the TextBoxWatermarkExtender and a DropDownExtender, and a regular textbox for user input.  The web control containing all of those controls was placed on a page that also had a master page (as you can tell there is going to be some renaming once its rendered to the browser)  The action to perform was to check if the textbox was empty and display a message to the user.  The problem was getting to that textbox, checking the text and not getting the watermark text.  The answer to this is in the BehaviorID property of the TextBoxWatermarkExtender.  With this id you can give the name of the control and use that in javascript to find the control. 

First set the BehaviorID in the control that you're using.  That BehaviorID you give it will be the one you use in javascript to find that control.

So, the solution in javascript would be something similar to this:

    //this finds the object on the page or any control with a behavior id

    var obj = $find("watermarkextender_behaviorID_here"); 

 

    //the get_Text method returns the text of the control, and NOT the watermark text

    var objectText = obj.get_Text();

 

    if(objectText == '')

    {

        alert("Hey User! Enter something useful!");

        return false;

    }

Comments

• Anonymous
  April 10, 2007
  What do you mean by "BehaviorID"i'm using master page and created some content pages for it.in one of my content pages, there's a ASP.NET textbox with the ID "txtUserID". When i check the properties of that textbox, there isn't any "BehaviorID " ID for me to choose, nor change.and now i'm having problem of usign javascript to validate if it's blank.pls advise.

• Anonymous
  April 11, 2007
  Well, the BehaviorID works well with the AJAX Control Toolkit.  This is a separate library with controls included.  You can download it at http://www.asp.net.  Here is an example of the defined control with that property:  <ajaxControlToolkit:TextBoxWatermarkExtender WatermarkCssClass="Watermark"     ID="WatermarkControl" BehaviorID="WatermarkTextBox" runat="server" TargetControlID="MyTextBox"     WatermarkText="" /> If you are simply looking to use an asp.net textbox to validate that the user has entered in text, I would use the required field validator control and point it at your textbox.  Then use a validationsummary control if you want a pop-up/alert style message (set the ShowMessageBox property to True).

• Anonymous
  August 10, 2007
  How would you identify a checkbox placed within a FormView control which itself is on an Update Panel.The Update Panel is on a Tab Panel belonging to a tab container.The page also uses a master page.I ask the question as I'd like to be able to identify if the checkbox is checked within javascript and to decide what action to do next.thanks

• Anonymous
  August 13, 2007
  You could do 1 of two things.  If you're using an asp:Checkbox, I would suggest using the ClientID to get the actual ID that is created.  For example, I created this in my Page_Load (I had a checkbox named 'myCheckBox' that I have on my page): myCheckBox.Attributes.Add("onclick", string.Format("javascript:helloThere('{0}')", myCheckBox.ClientID)); Then my javascript: function helloThere(myName)     {         var o = document.getElementById(myName);         if(o.checked == true)         {             alert('hello');         }     } If its just a html input, then just do not put the runat=server tag and you can do the same thing by just passing the id, such as: < input type="checkbox" id="brettsCheck" onclick="javascript:helloThere('brettsCheck');" />

• Anonymous
  January 31, 2009
  The comment has been removed