Currently, I am facing an issue with firing the .ajaxComplete function on a demo site. I have referred to this function from this link.
Below is my code :
<SCRIPT type="text/javascript">
<!--
/*
Credits: Bit Repository
Source: http://www.bitrepository.com/web-programming/ajax/username-checker.html
*/
pic1 = new Image(16, 16);
pic1.src = "loader.gif";
$(document).ready(function(){
$("#userID").change(function() {
var usr = $("#userID").val();
if(usr.length >= 4)
{
$("#status").html('<img src="loader.gif" align="absmiddle"> Checking availability...');
$.ajax({
type: "POST",
url: "check.php",
data: "userID="+ usr,
success: function(msg){
$("#status").ajaxComplete(function(event, request, settings){
if(msg == "OK")
{
$("#userID").removeClass('object_error'); // if necessary
$("#userID").addClass("object_ok");
$(this).html(' <img src="tick.gif" align="absmiddle">');
}
else
{
$("#userID").removeClass('object_ok'); // if necessary
$("#userID").addClass("object_error");
$(this).html(msg);
}
});
}
});
}
else
{
$("#status").html('<font color="red">The username should have at least <strong>4</strong> characters.</font>');
$("#userID").removeClass('object_ok'); // if necessary
$("#userID").addClass("object_error");
}
});
});
//-->
</SCRIPT>
I attempted to alert the msg and found that the check.php is able to return the value of msg. However, it seems to stop at the .ajaxComplete() function and does not trigger the function after that. Any guidance on how to resolve this would be greatly appreciated. Thank you.