CODEWITHSUNDEEP
javascriptjquery
Suresh Pattu
Suresh Pattu

Reputation: 6209

Simple validation using JQuery Not Working

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>

Upvotes: 2

Views: 116

Answers (1)

Kamran Ali
Kamran Ali

Reputation: 5954

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

Upvotes: 1

Related Questions