loading по клику Оформить

[Денис]

Часто приходят дублированные заказы, а парой и 3-4 сразу, в следствии медленного интернете покупателя и множественного нажатия на кнопку Оформить. Может кто-то фиксил это блокировкой сабмита и выводом какого-то прогресса?

Изменено 1 марта, 2016 пользователем Денис

[Kors]

http://simpla-tuning.com/cart-stop-repeted-form-sending

[kislotnik]

Часто приходят дублированные заказы, а парой и 3-4 сразу, в следствии медленного интернете покупателя и множественного нажатия на кнопку Оформить. Может кто-то фиксил это блокировкой сабмита и выводом какого-то прогресса?

вот скрипт отключающий кнопку на заданное время

<script>
 $('.button').click(function(){
    var submit = $(this);
    setTimeout(function() {
    submit.attr('disabled', 'disabled');
	},100);
    setTimeout(function() {
         submit.removeAttr('disabled');
    },3000);
    
 });
</script>

[Денис]

 

вот скрипт отключающий кнопку на заданное время

<script>
 $('.button').click(function(){
    var submit = $(this);
    setTimeout(function() {
    submit.attr('disabled', 'disabled');
	},100);
    setTimeout(function() {
         submit.removeAttr('disabled');
    },3000);
    
 });
</script>

 

не совсем подходит имея уже baloon.js погуглив нашел оптимальный вариант связки http://malsup.com/jquery/form/ и http://jqueryvalidation.org/

 

Примерный вариант моего кода, думаю не сложно будет сделать кому-то для своего сайта

 

 

<script type="text/javascript">
$(function() {
    
    $(".form").validate({ // форма
        rules: {
            name: "required",
            phone: "required",
            address: "required"
        },
        messages: {
            name: "Введите ФИО",
            phone: "Введите телефон",
            address: "Введите адрес доставки"
        },
        //Если все хорошо, отправляем post данные по заказу
        submitHandler: function(form){
            $(".btn-send").attr('disabled', true); //блокирует сабмит
            $(".submit_row").show(); //блок с гифкой загрузки
            $(form).ajaxSubmit({
                target: '.target-block', //блок где выводится результат post
                url: "/cart",
                success: function(){
                    $(".block-form").html(''); //в этом блоке должно быть все содержимое корзины которое скроется при успешной отправки заказа
                }
            }); 
        }
   });
  
});
</script>

в cartview.php после      $this->cart->empty_cart(); пишем сообщение которое выведется в блоке с class="target-block". В итоге получим дополнительно оформление заказа без перезагрузки страницы

Изменено 2 марта, 2016 пользователем Денис

[Kors]

В обоих решения - и #3 и #4 - подход неверный ПРИНЦИПИАЛЬНО.

Они блокируют кнопку, а надо блокировать отправку формы. Это совсем не одно и то же.

[Денис]

у меня вначале идет блокировка формы, после валидации и сабмита кнопка блокируется, можно дописать ее скрытие $(".btn-send").hide(); и все, показывается loading все отлично работает. А предлагать платные решения есть отдельный раздел

[Kors]

у меня вначале идет блокировка формы...

Что-то не видно в Вашем коде блокировки формы...