ansaurus

Question

a better way to swap values of text inputs?

Answer 1

+1 A:

I think you still need 2 Listeners

    $('.swap_value').focus(function(){
      if($(this).val() == 'sign up'){
        $(this).val('');
      }
    }).blur(function(){
      if($(this).val() == ''){
        $(this).val('sign up');
      }
    });

I hope thats gives you an example of how to work with 2 fields:

<html>  
    <body>   
        <input type="text" value="sign up" class="swap_value singup"/>
        <input type="text" value="search" class="swap_value search"/>
    </body>
 </html>
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script>
   //<!--
    $(document).ready(function(){
        $('.swap_value').focus(function(){
          if($(this).val() == 'sign up' || $(this).val() == 'search'){
            $(this).val('');
          }
        });
        $('.search').blur(function(){
          if($(this).val() == ''){
            $(this).val('search');
          }
        });
        $('.singup').blur(function(){
          if($(this).val() == ''){
            $(this).val('sign up');
          }
        });
    });
    //-->
</script>
</body>
</html>

Hannes 2010-10-01 15:52:46

@Hannes - this works great. Is there a way to use the same function for 2 boxes, if($(this).val() == 'sign up' || 'search') or do I have to write separate functions for each? when I do this it replaces 'search' with 'sing up' on blur

Dirty Bird Design 2010-10-01 16:29:08

@Dirty Bird Design if they have the same class the listeners will apply to bove of them BUT while you can say `if($(this).val() == 'sign up' || $(this).val() == 'search')` ... ` $(this).val() == '' ` is always the same, so you need at least 3 listeners

Hannes 2010-10-01 16:53:49

Yes, both are ".swap_value". I get where I can combine the first " if($(this).val() == 'sign up' || $(this).val == 'search') but not sure on the blur function, it keeps replacing the value with sign up how do you tie the search to the search listener?

Dirty Bird Design 2010-10-01 16:59:13

@Dirty Bird Design Like i said,`$(this).val() == ''` will always be true for both input fields, so it will always apply, i will add something in my answer that may help you

Hannes 2010-10-01 17:07:23

@Hannes - thx man, i learned something.

Dirty Bird Design 2010-10-01 17:25:41

ansaurus

tags:

views:

answers:

a better way to swap values of text inputs?

related questions