Simple validation using JQuery Not Working

Question

I am trying to make a label's text green in color whenever I enter a value in the text box. If not then label's text color will be blue.

When I enter a value into the text box that time the label's color is changing to green. However, when I delete the text, the label stays green and does not change to blue.

My HTML code is:

<html><body><form>  
    <input type="text" id="name" name="name" placeholder="First Name" />
    <label for="name">First Name </label>  
</form></body></html>

My script is:

<script type="text/javascript" src="jquery-1.5.2.min.js"></script>   
<script type="text/javascript">  
    $(document).ready(function(){  
        $('input[type="text"]').focusin(function() {  
            var sd=$(this).attr('id');  
            var val=$(this).val();  
            $('label[for^="'+sd+'"]').css('display','inline');  
        });  

        $('input[type="text"]').focusout(function() {  
            var val=$(this).val();  
            var sd=$(this).attr('id');               
            if(val===''){  
                $('label[for^="'+sd+'"]').css('display','none');  
            }  else {
                $('label[for^="'+sd+'"]').css({
                    'display':'inline',
                    'color':'#82A714'
                });
            }    
         });  
    });  
</script>

Kamran Ali · Accepted Answer · 2011-12-08 05:11:52Z

1

you hav to $('input[type=text]) not $('input[type="text"]'), here is the working code for you JS Fiddle

answered Dec 8, 2011 at 5:11

Kamran Ali

5,9542 gold badges29 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Suresh Pattu Over a year ago

after i enter value that time the text color change to green it's fine

Suresh Pattu Over a year ago

see my problem is after i delete value in the textbox what i entered in the textbox then also the text color showing green i don't want to show in green

Kamran Ali Over a year ago

now check the JS Fiddle, i have solved your problem

Collectives™ on Stack Overflow

Simple validation using JQuery Not Working

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related