I am using this JS to clear text box when user click on it, so this works fine and clears all the text box in the page, I want to clear only the search text box Search.. How can I do that, Other text box should not be cleared and only this search text box should be cleared when I click on it.

  <script type="text/javascript">
        $(function () {

            $('input[type=text]').focus(function () {

                $(this).val('')
            });

        });
    </script>

And another question.

I have a panel with few text box, how can i set focus on a particular text box

 <asp:TextBox ID="txt_Name" runat="server" />

I am using this JS to clear text box when user click on it, so this works fine and clears all the text box in the page, I want to clear only the search text box Search.. How can I do that, Other text box should not be cleared and only this search text box should be cleared when I click on it.

  <script type="text/javascript">
        $(function () {

            $('input[type=text]').focus(function () {

                $(this).val('')
            });

        });
    </script>

And another question.

I have a panel with few text box, how can i set focus on a particular text box

 <asp:TextBox ID="txt_Name" runat="server" />

• c#
• javascript
• jquery
• asp

7 Answers 7

Just select the TextBox via it's ID or another attribute

e.g.

<asp:TextBox id="txt_Search" runat="server" />

Then select the TextBox via it's unique client ID.

$('#<%=(txt_Search.ClientID)%>').focus(function() { $(this).val(''); });

For clear value - $('#yourTextBox').val('');

For set focus - $('#yourTextBox').focus();

I think its not the best idea to use id values since might change the id value in runtime

eg MainContent_txt_Name

you can do something like this

<asp:TextBox ID="txt_Name" CssClass="myText" runat="server" />

<script type="text/javascript">
        $(document).ready(function () {    
           $('.myText').click(function() {
                $(this).val('')
            });    
        });
</script>

instead of $('input[type=text]') do $('search-box-id')

all you need is to specify id for the search box, try to inspect your element, or view source in order to get right id, because id is generated by ASP.NET web forms, or you can add custom attribute like rel="search-box"

so this is javascript

$(document).ready(function() {
  //for id
   $('#id_of_text_box').focus(function() { $(this).val(''););
  //for rel attribute
   $('input[rel="search-box"]').focus(function() {$(this).val(''););
});

I would go with HTML5's defaultvalue attribute falling back to this jquery approach:

http://unwrongest./projects/defaultvalue/

Another option, going down a slightly different route, use the JQuery textbox watermark ponent. This has already been created to do just what you are asking and will repopulate when they click away from the textbox, but the backend will never see the value. Save you the hassle of doing it your self!

http://code.google./p/jquery-watermark/