<script>
$(document).ready(function(e) {
$('.username').change(function(e) {
var usr = $('.username').val()
if(usr.length >= 4) {
$('#status').html('<font><image src="images/loader.gif" />Checking username...</font>');
var request = $.ajax({
url:"check.php",
type:"POST",
data:"username="+usr
});
request.done(function(msg) {
if(msg == 'OK') {
$('#status').html('<font color="green"><img src="images/accepted.png /> Available</font>');
}
else {
$('#status').html(msg);
}
});
request.fail(function(jqXHR, textStatus) {
$('#status').html(textStatus)
});
};
});
});
</script>
the script works, request.done
returnes the corect msg
msg = OK //if username is Available
msg = The username '.$username.' is already in use. //if the username exists
but i cant get the if msg == OK to modify the #status.....#status is left empty if msg = OK
You've got a typo -- missing the end-quote on the image src
.
$('#status').html('<font color="green"><img src="images/accepted.png /> Available</font>');
^ missing " here
Note that there's an element-creation syntax in JQuery that can help to avoid (or at least detect) these kinds of typos:
var el = $("<font>", { color: "green" }).append(
$("<img>", { src: "images/accepted.png" })
).append("Available");
$("#status").html(el);