CODEWITHSUNDEEP
javascriptjquerycssajax
user3599482
user3599482

Reputation: 157

How to bind change event dynamically in jquery

I am doing username availability check. I made jquery ajax call, its working fine and if username already in use i want to make label and textbox in red color. for this purpose i am adding css class in the callback function of $Post() method. The problem I have is css is not applying. I think the problem is in dynamically binding the event So please can any one help me in this. Here is my jquery script,

$(document).on('change', '#uName', function() {

    var uName = $(this).val();//get the string typed by user
    if (uName!=''){
        $.post('<%=request.getContextPath()%>/controller/UserNameCheckController',{'uName':uName},
               function(data) {
                   $('.status').html(data);
                   var status = $.trim($("#status").text());
                   if(status=="Username in use try another"){
                       $('#unameBlock').addClass('error'); 
                   }
               });
    }
    else{
        $('.status').html('');
    }
});

Help me to fix this please. Thanks.

Upvotes: 0

Views: 69

Answers (2)

Mayank
Mayank

Reputation: 122

try changing it to 

var status = $.trim($("#status").html());

it could be .status or #status depends upon the class or id you have used in your html.

Upvotes: 0

Pranav C Balan
Pranav C Balan

Reputation: 115242

I think the error lies on your class selector

Change

$.trim($("#status").text());

to

$.trim($(".status").text());
//--------^-----------------

Upvotes: 1

Related Questions