2

I got this Text box with default value as "First Name" ..Now when I click inside this text box to enter name , this value "First Name" keeps on displaying. What I want is to the text box to clear as soon as I click inside it. What property do I need to set in mt textbox tag ?

[Edit] ok anything from Telerik that I can use to do that ?

1
  • Updated my answer with info about Telerik
    – Josh
    Nov 26, 2010 at 5:20

6 Answers 6

6

There is not out of the box functionality in TextBox that will accomplish this, but the ASP.Net Ajax Toolkit has a Watermark Extender that will do everything you want.

I have used both, but now personally use a jQuery Watermark Plugin

Either will work just fine, choose based on your needs.

According to the Telerik docs you just have to set the EmptyMessage property on their TextBox control. Demo Page Here

1
  • thnx..yeah I did it that way only..don't u just love telerik ? I know I do :D
    – Serenity
    Nov 26, 2010 at 20:08
2

In the code behind, on Page Load you can add the following code to achieve this

TextBox1.Attributes.Add("onClick", "javascript:if(this.value=='First Name'){this.value='';}");
2
  • i was in a discussion for giving example :(. Nov 26, 2010 at 4:39
  • 1
    use onFocus inplace of onClick since it can be focused by TAB key Nov 26, 2010 at 4:40
2

You can use the method suggested by @Josh. If you do not want to use Ajax Toolkit controls or JQuery you could write it on your own using Javascript. Write a function which gets called when the foucs is received by the textbox control. I thik the function is called onfocus or just focus in Javascript.

2

Hi I just wrote this small function which will achieve your desired result

function clearInputBox(x,prefil){
    if(x.value == prefil){ 
        x.value = '';
    }
}

Your input box looks like this

<input type='text' value='First Name' onfocus="clearInputBox(this,'First Name')" />
1

May be this will help you

0

Taking Shobans advice one step farther, you could add something like this to your Page subclass

protected override void OnInitComplete(EventArgs e)
{
    string jsString = "javascript:if(this.value=='" + TextBox1.Text + "'){this.value='';}";
    TextBox1.Attributes.Add("onFocus", jsString);
    base.OnInitComplete(e);
}

What this will do is, it will always consider that default string is the one this controll contains at esign time (the initial one in your .aspx file), so you wont have to manually change it in codebehind every time you change your .aspx. Remember, that OnIinitComplete fires before any viewstate or postback data has been applied, but after the controlls on your page have been set to their default values.

P.S. As anishMarokey pointed, use onFocus vs onClick, since fields can gain focus without clicks via Tab key.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.