JQuery Key-Up / AJAX ошибка
У меня есть страница, где клиенты могут указать количество продуктов, которые они хотели бы заказать. Поэтому я использовал функцию jquery key-up в сочетании с ajax-скриптом:
<input type="text" class="number" data-product_id="1">
<input type="text" class="number" data-product_id="2">
<input type="text" class="number" data-product_id="3">
и т.п.
<script>
$(function() {
$("input.number").keyup(function() {
$.post("number.php", { product_id: $(this).data('product_id'), number: $(this).val() }, function(data){ if (data != "1") { alert('Error occurred'); } });
});
})
</script>
В принципе, эта система работает хорошо. Числа временно хранятся в сеансе PHP и будут обработаны позже. Но есть проблема: есть несколько полей ввода (> 500), и пользователи вводят количество элементов, которое они хотели бы заказать очень быстро, с помощью кнопки табуляции. Я обнаружил, что не все числа сохраняются правильно, если пользователь вводит его очень быстро, несмотря на то, что файл number.php действительно маленький по размеру, только строка $_SESSION[$_POST['product_id']] = $_POST['number']; находится в файле.
Есть ли какие-либо решения для проверки всех полей, представленных?
Решение
$(function() {
$("input.number").keyup(function() {
var that = $(this);
that.addClass('loading');
$.post(
"number.php",
{ product_id: $(this).data('product_id'), number: $(this).val() },
function(data) {
that.removeClass('loading').removeClass('failed');
if (data != that.val()) {
that.addClass('failed');
}
}
);
});
});
В основном добавить класс failed если возвращаемое значение не соответствует входному значению. Это предполагает, что number.php возвращает сохраненное значение, конечно. Вы можете позже проверить поля ввода с классом failed,
Другие решения
Других решений пока нет …