user2700965 user2700965 - 5 months ago 29
Javascript Question

Update table via AJAX on change of number input

I got a problem with an AJAX update via jQuery. I have an input field of type "number". Every time a user updates its value via up click or downclick a table gets updated via AJAX.

It works, but: If you update its value too fast, jQuery simply skips some steps and updates it only a few times. Is there any way to prevent that and trigger the AJAX function on every single click?

Also: You can add numbers into the input number by typing it in without clicking the up and down buttons. Any way to prevent that?

Answer

You'll want to disable the control that fires the AJAX until after it has successfully completed -- or failed.

If you look at the jQuery.post() documentation you'll see handlers for each:

// disable the up and down UI elements here, re-enable in the .always() function
var jqxhr = $.post("example.php", function() {
  alert("success");
})
.done(function() { alert("second success"); })
.fail(function() { alert("error"); })
.always(function() { alert("finished"); });
Comments