0

Ok so, Im using jQuery to do username and email checks before a signup...

this sets a variable true or false depending on the response from php.

$(document).ready(function() {
                if (usr_checked == true) {
                    if (em_checked == true) {
                        $("#registerbttn").removeAttr("disabled");
                    }
                }
                else {
                    $("#registerbttn").attr("disabled", "disabled");
                }
            });

How exactly do i get it to watch those variables live?

Thanks :D The Code below is one of the sets of code that sets the functions

pic1 = new Image(16, 16); 
pic1.src = "loader.gif";

$(document).ready(function(){

$("#username").change(function() { 

var usr = $("#username").val();

if(usr.length >= 3)
{
$("#unstatus").html('<img src="loader.gif" align="absmiddle">&nbsp;Checking availability...');

    $.ajax({  
    type: "POST",  
    url: "check.php",  
    data: "username="+ usr,  
    success: function(msg){  

   $("#unstatus").ajaxComplete(function(event, request, settings){ 

    if(msg == 'OK')
    { 
        $("#username").removeClass('object_error'); // if necessary
        $("#username").addClass("object_ok");
        $(this).html('&nbsp;<img src="accepted.png" align="absmiddle"> <font color="Green"> Available </font>  ');
        $("#registerbttn").removeAttr("disabled");
        var usr_checked = true;
    }  
    else  
    {  
        $("#username").removeClass('object_ok'); // if necessary
        $("#username").addClass("object_error");
        $("#registerbttn").attr("disabled", "disabled");
        $(this).html(msg);
        var usr_checked = false;
    }  

   });

 } 

  }); 

}
else
    {
    $("#status").html('<font color="red">The username should have at least <strong>3</strong> characters.</font>');
    $("#username").removeClass('object_ok'); // if necessary
    $("#username").addClass("object_error");
    $("#registerbttn").attr("disabled", "disabled");
    var usr_checked = false;
    }

});

});
DeviledMoon
  • 15
  • 1
  • 6
  • Can you show the code setting those variables? – Nick Craver Jun 05 '10 at 10:00
  • Well, when the ajax function is sent to the PHP script, it returns a code, "er, era, erm" they all set the variable to false, if it returns "ok" it updates all the html data to say "Not in use" and sets the var to true. now there are the two vars, when they are both set to true, it needs to enable the submit button, the code above is what im using to do that, but unfortunately it dosen't see the variables live and update the disabled part if they are both true, i need it to do that, – DeviledMoon Jun 05 '10 at 10:06
  • what does the `` tag do? – Anurag Jun 05 '10 at 11:13
  • adds color to the font when it responds with an error – DeviledMoon Jun 05 '10 at 11:31

2 Answers2

1

I think it's better if you don't rely on variables and use custom events instead. For example, you can create and bind to a custom event which gets triggered when your ajax checker finishes. Here's a sample code which shows how this could work:

// on $(document).ready
$('#username')
  // bind to a custom event triggered when validation of username succeeded
  .bind('checkValid', function() {
    alert('enabling the button');
    $('#registerbttn').removeAttr('disabled');
  })
  // bind to a custom event triggered when validation of username failed
  .bind('checkFailed', function() {
    alert('disabling the button');
    $('#registerbttn').attr('disabled', 'disabled');     
  });


// In your ajax handlers (i.e. $("#unstatus").ajaxComplete), 
// if username was valid, trigger the valid event.
// This will call the checkValid handle we declared above and
// enable the button
$('#username').trigger('checkValid'); 

// If the username check failed though, trigger checkFailed instead
// which will call the handler above which disables the button
$('#username').trigger('checkFailed');

Here's a sample of it working here: http://jsfiddle.net/wU8vY/

​

Shiki
  • 16,688
  • 7
  • 32
  • 33
0

You don't get it to "watch" variable. You have to change the attributes in same place you set usr_checked (I presume you set it when your ajax call returns).

If you post your ajax function, I might be able to be more specific.

Luc
  • 1,488
  • 1
  • 13
  • 31