jquery ajax check available information

do it with keyup and use settimeout with $.proxy technic

  • keyup => event for detect keyboard input #note if you use keypress instead keyup you will see backspace problem
  • settimeout => delay for ajax to check available
  • $.proxy => in settimeout scope you can’t use $(this) in this scope. this is $.proxy solve problem

for an example .. to check categoryFolder input

$( document ).ready(function() {
var timeout;
$('#checkAvailable').html('<img src="'+BASE_URL+'assets/images/ajax-loader.gif" alt="" />');
$("#categoryFolder").bind('keyup',function(e) {
if(typeof(timeout) != "undefined")clearTimeout(timeout);
timeout = setTimeout($.proxy(function(){
var categoryFolder = $(this).val();

$.ajax({
type: "POST",
url: BASE_URL+"checkAvailable.php",
data:"categoryFolder="+categoryFolder,
success : function(msg) {
if(msg === "OK")
{
$('#checkAvailable').parent('div').removeClass('has-error').addClass('has-success');
$('#checkAvailable').html("this category is available.");
$('#checkAvailable').show();
$('#submit').removeAttr('disabled','disabled');
}
else
{
$('#checkAvailable').parent('div').removeClass('has-success').addClass('has-error');
$('#checkAvailable').html("this category is already.");
$('#checkAvailable').show();
}
}
});
}, this) ,500 );
});
});

Related posts:

This entry was posted in knowledge. Bookmark the permalink.