Перезагрузка Страницы После Отправки Формы. Просьба: Подскажите С Ajax

Код формы из view.tpl


Отправить

Код из php контроллера

if ($_SERVER['REQUEST_METHOD'] == 'POST') {

if ($mode == ‘form_submit’) {
// …
}

return array(CONTROLLER_STATUS_OK, “totalizator.view”);

}

Подскажите, какие изменения нужно сделать в коде, чтобы:

1. Страница не перезагружалась.

2. Перезагружался только блок с моим id. И на него передавались обновленные данные.

Видеоуроки по AJAX пересматривал 3 раза. В моем случае не помогли. Видимо, где-то что-то неправильно сделано в моих кусках кода. Уже пробовал изменять передачу данных в php на свой tpl, вставлять комментарии в tpl по типу и др. По урокам. Не выходит.

Самое главное чтобы хотя бы страница не перезагружалась. Понять почему.

1 лайк

Ссылку можете дать? Из-за яваскриптовых ошибок может cm-ajax не срабатывать. Ну а чтобы блок обновлялся, нужно скрытый инпут добавить


а в шаблоне должно быть

...

Убрал у тега классы cm-ajax cm-processed-form

На кнопку "отправить" поставил класс cm-ajax.

Заработало!)

Почему? Пока не понятно. Видимо из-за cm-processed-form.

Причем данные на странице обновляются, что не может не радовать, но вот.........

Теперь новый вопрос, который нужно решить.

блоки с результатами от формы выводятся в слайдер с
bxsliderKonkurs">. Когда ajax'ом перезагружаешь это слайдер, то он слетает. Просто тупо выводятся блоки. Надо как-то заново проинициализировать этой слайдер. Видимо через JS.

Подскажете как это сделать?

Можете подсказать как решается проблема с подзагрузкой JS при аяксе?

Пытаюсь сделать это через callback:

(function(_, $) {

//…

function fn_form_post_totalizator_form(response) {
    console.log('fn_form_post_totalizator_form work');
    console.log(response);
    initBxSlider();
    return true;
}

//…

}

в консоль ничего не выводит((

JS ошибок критических нет.

Не так js-функцию называю? Или не туда вставляю JS?

Так тоже не работает

$.ceEvent('on', 'ce.formajaxpost_totalizator_form', function() {
        console.log('Ajax done');
        initBxSlider();
        return true;
    });

Попробуйте на тэг script повесить класc cm-ajax-force. Ну или колбэки используйте

http://docs.cs-cart.com/4.3.x/core/front-end/microformats.html

По неведомым совершенно причинам код коллбека не срабатывает

(function(_, $) {
$.ceEvent('trigger', 'ce.formpost_totalizator_form');

$.ceEvent('on', 'ce.formpost_totalizator_form', function() {
    console.log('Ajax done');
    alert('ajax done');
    initBxSlider();
    return true;
});

//…

Отправить

Ссылку дать не могу, покольку локальная версия(

JS ошибок нет критических. Только 404 (not found)

((((

Ура! Получилось решить вопрос!

Пришлось добавить inline JS в tpl с классом ajax-force ПЕРЕД ЗАКРЫВАЮЩИМ КОММЕНТАРИЕМ :


                    (function(_, $) {
                        $(document).ready(function () {
                            // slider for Totalizator
                            if(document.getElementById('bxsliderKonkurs') !== null){
                                bxsliderKonkurs = $('#bxsliderKonkurs');
                                $(bxsliderKonkurs).css('display','block');
                                $(bxsliderKonkurs).bxSlider({
                                    minSlides: 3,
                                    maxSlides: 3,
                                    slideWidth: 300,
                                    infiniteLoop: false
                                });
                            }
                        });
                    }(Tygh, Tygh.$));
            </script>

Но все-равно, Я чувствую, что это не идеальный способ решения вопроса.

И почему-то коллбек в JS не срабатывает, видимо нужно помещать его внутрь AJAX комментария ???

Попробуйте вместо formpost использовать formajaxpost

Еще у вас в имени формы в одном месте дефис, а в другом - нижнее подчеркивание

Точно, дело в имени видимо!! *моя невнимательность* )

Спасибо!

Тема та же, поэтому здесь

переписал стандартный модуль журнала заказов
только одно не понимаю. Я так понимаю, когда я на карточке заказа меняю статус заказа - генерируется событие ce.update_object_status_callback . но по

 $.ceEvent('on', 'ce.update_object_status_callback', function() {
            var url = fn_url('orders.update_order_logs?order_id=' + $("#val_order_id").val());
            $.ceAjax('request', url, {
                result_ids: 'order_logs'
            });
        });

не происходит перезагрузка блока… блок теперь не в табе, но это по идее значения то не имеет?
console.log(‘Ajax done’); - тоже ничего не выводит, то есть коллбека не срабатывает…

Однако, разобрался. У меня 4.9.3, установил модуль в последнюю версию, и всё работает. Видимо раньше это не работало, а с тех пор разработчики поправили скрипты

1 лайк