AjaxForm не отправляет письма

Здравствуйте!

Хотел сделать на сайте контактную форму и решил использовать, AjaxForm c FormIt.
Но возникла проблема, он не отправляет сообщения, если не заполнять пункты ошибка самого Ajax (в виде красного окошка) не выводится (только подсвечивание красным само поле). В FormIt(тот что в админке) оповещение о отправке формы нет.
Чанк:

<form action="" method="post" class="form form_ask form_banner">
                    <div class="form__inputs">
                        <div class="input input_banner">
                            <input id="af_name" class="input__field required" type="text" name="name" value="" placeholder="" />
                            <label class="input__label" for="af_name">Ваше имя</label>
                            <span class="input__error error_name">Поле не заполнено!</span>
                        </div>
                        <div class="input input_banner">
                            <input id="af_phone" class="input__field userphone required" type="text" name="phone" value="" placeholder="" />
                            <label class="input__label" for="af_phone">Номер телефона</label>
                            <span class="input__error error_phone">Поле не заполнено!</span>
                        </div>
                    </div>
                    <div class="form__send">
                        <button type="submit" name="order" class="btn btn_questions btn_banner-form">Отправить заявку на обратный звонок</button>
                       
                        <div class="input input_checkbox">
                            <input class="input__checkbox required" type="checkbox" name="agree" />
                            <div class="input__checkbox-mark"></div>
                            <div class="input__label input__label_checkbox input__label_banner">Я соглашаюсь с <a class="input__link" href="pdf/confidentiality.pdf" target="_blank">правилами обработки персональных данных</a> и <a class="input__link" href="pdf/confidentiality.pdf" target="_blank">политикой конфеденциальности</a>.</div>
                        </div>
                    </div>
                </form>

AjaxForm:

[[!AjaxForm? 
                  &form=`tpl.AjaxForm` 
                  &snippet=`FormIt` 
                  &hooks=`spam,email,FormItSaveForm`
                  &emailSubject=`Тестовое сообщение`
                  &emailTo=`plohotnichenko_oleg@mail.ru`
                  &emailFrom=`info@countrynet.ru`
                  &emailTpl=`tpl.email`
                  &validate=`name:minLength=^2^,email:email:required`
                  &validationErrorMessage=`В форме содержатся ошибки!`
                  &successMessage=`Сообщение успешно отправлено`
                ]]

tpl.email:

<h3>Сообщение "Перезвоните мне"</h3>
<p>От кого: [[+name]]</p>
<p>Телефон: [[+phone]]</p>

Помогите, люди добрые.

Oleg

07 апреля 2019, 20:54

2 626

Комментарии: 19

Андрей

07 апреля 2019, 21:07

У вас указано обязательным поле email, которого нет в форме, поменяйте например так:

&validate=`name:minLength=^2^,phone:isNumber:required`

Oleg

07 апреля 2019, 21:09

Извиняюсь, это я тоже заметил, но форма всё равно не работает. Сообщения не отправляет.

Андрей

07 апреля 2019, 21:26

Без ajaxForm пробовали отправку проверять? Ставьте — QuickEmail, смотрите какой лог выдаст.

Oleg

08 апреля 2019, 14:58

Сообщение на почту не пришло. Хотя плагин написал что сообщение отправлено. Пробовал вывести через

[[!QuickEmail? &debug=`1`]]

так же написало почту на которую отправлять и «Сообщение успешно отправлено». emailsender в настройках заполнен верно.
В error логах жалоба на " modRestClient::__construct is deprecated since version 2.3.0. Use the modRest classes instead."

Андрей

08 апреля 2019, 16:04

В error логах жалоба на " modRestClient::__construct is deprecated since version 2.3.0. Use the modRest classes instead."

Это информация для разработчиков. Можно отключить в системных настройках опцию — log_deprecated, чтоб не мешалось.

Сообщение на почту не пришло. Хотя плагин написал что сообщение отправлено.

В спаме смотрели? Какой хостинг провайдер?

На некоторых хостингах нужно чтобы ящик с которого идёт отправка существовал физически. Если не решите проблему и есть возможность, присылайте доступы в личку, посмотрим на вашу проблему изнутри =)

Oleg

08 апреля 2019, 17:20

Хостинг masterhost. В спаме сообщений нет.

Андрей

08 апреля 2019, 17:49

С мастерхостом в плане почты проблем не было, попробуйте тогда написать в техподдержку.

p.s. Если домен указанный в emailFrom реальный, он делегирован на серверы Яндекса, что можно сделать только после подключения почты для домена. Вариант проверить все настройки (MX записи и т.п.), и можно настроить отправку почты через smtp.

Oleg

08 апреля 2019, 18:05

А что на счёт оповещений ajax? Они в самой форме тоже не отображаются, как при ошибках так и при попытке отправки сообщения. (Те прямоугольники в правом верхнем углу) Подключал как в стандартном шаблоне. Более того создал чистую страницу с стандартной формой, и опять же ничего не происходит. Даже почту обычную ставил @mail.ru всё рано никакого результата. Может к ним нужно подключать отдельно какие то js/css библиотеки?

Андрей

08 апреля 2019, 18:30

Может к ним нужно подключать отдельно какие то js/css библиотеки?

Кроме jQuery ничего не нужно. Посмотрите ошибки в консоли браузера, может какой то конфликт js.

Oleg

08 апреля 2019, 20:12

Нашёл проблему. Она была в подключаемой bundle.js. Без неё форма работает исправно, но дело в том что она(bundle.js) жизненно необходима самому сайту (ибо ребята которые делали шаблон так решили) сам же сайт не подключается к jquery.
Если js оставить то форма выводит на формит следующее.

{"name":{"value":"Имя"},"phone":{"value":"+7 (000) 000-00-00"},"agree":{"value":"on"}}

Сама библиотека огромна, и как я понял в 11 строчек. Есть предложения? (Копировать её в комментарий чистой воды издевательство, возможно как то файлик перекинуть?)

Oleg

09 апреля 2019, 16:57

Может есть другие контактные формы? Можете какие то посоветовать?

Андрей

10 апреля 2019, 13:35

Нашёл проблему. Она была в подключаемой bundle.js. Без неё форма работает исправно, но дело в том что она(bundle.js) жизненно необходима самому сайту (ибо ребята которые делали шаблон так решили) сам же сайт не подключается к jquery.

И совсем никаких ошибок в консоли браузера не выводит при подключённом bundle.js?

(Копировать её в комментарий чистой воды издевательство, возможно как то файлик перекинуть?)

Файл можно закинуть на любое файлохранилище и приложить ссылку.

Может есть другие контактные формы? Можете какие то посоветовать?

Так то отправкой и обработкой формы занимается formIt, если нужна обработка формы именно через ajax, можно написать свой скрипт.
Но я бы всё таки разобрался с этим bundle.js, из за чего и почему глючит. =)

Oleg

10 апреля 2019, 15:09

Совсем никаких ошибок от bundle.js. Сам файл cloud.mail.ru/public/6FMU/36Km6wuq9

Андрей

10 апреля 2019, 15:45

Ну тут надо смотреть какие плагины собраны в него, вероятно с одним или несколькими из них конфликт, с этой задачей лучше обратиться к разработчику шаблона.

Oleg

10 апреля 2019, 17:20

Возможно есть какой то способ оградить контактные формы от этой библиотеки?

Oleg

10 апреля 2019, 17:53

Я вот что заметил. На формит приходит спам учитывая что вывода форм на сайте нет. Как они это делают? Почему у них контактная форма работает?

Oleg

10 апреля 2019, 18:42

Я думаю проблема в этой части кода, но если её удалить весь js ложится.

3: [function(t, e, i) {
        "use strict";
        jQuery(function(t) {
            window.form_adjuster = {
                init: function(t) {
                    this.options = t, this.init_cache(), this.init_validation(), this.init_mask(), this.options.file && (this.build_file_structure(), this.check_file(), this.input_file_reset()), this.send_validation(), this.init_btn_no_ajax(), this.init_ajax_without_form(), this.number_only_init()
                },
                init_options: function() {
                    var e = !!window.wp_data && window.wp_data,
                        i = {
                            type: "POST",
                            handler: e.sau_sender_ajax_url ? e.sau_sender_ajax_url : "./form-handler.php",
                            dataType: "json",
                            contentType: !1,
                            processData: !1,
                            task: "task",
                            file: !1,
                            onload: !1,
                            success: !1,
                            error: !1
                        };
                    return this.options ? t.extend(i, this.options) : i
                },
                init_cache: function(e) {
                    this.options = this.init_options(), this.$input_phone = t(".userphone"), this.$input_date = t(".js-input-date"), this.$form = t("form:not(.js-no-ajax)"), this.$noajax_btn = t(".js-noajax-btn"), this.$number_only = t(".js-number-only"), this.$file_input = t(".js-file-check"), this.$btn_without_form = t(".js-single-button")
                },
                init_validation: function() {
                    t.validator.addMethod("regexp", function(t, e, i) {
                        var n = new RegExp(i);
                        return this.optional(e) || n.test(t)
                    }, "Please check your input."), t.validator.addClassRules({
                        userphone: {
                            regexp: "[^_]+$"
                        },
                        usermail: {
                            email: !0,
                            required: !0
                        },
                        required: {
                            required: !0
                        },
                        password: {
                            minlength: 6
                        },
                        passwordConfirm: {
                            minlength: 6,
                            equalTo: ".js-input-new-password"
                        }
                    })
                },
                init_mask: function() {
                    this.$input_phone.inputmask({
                        mask: "+7 (999) 999-99-99",
                        showMaskOnHover: !1
                    }), this.$input_date.inputmask("dd/mm/yyyy", {
                        showMaskOnHover: !1
                    })
                },
                form_send: function(e, i) {
                    var n = form_adjuster.options;
                    t.ajax({
                        type: n.type,
                        url: n.handler,
                        dataType: n.dataType,
                        contentType: n.contentType,
                        processData: n.processData,
                        data: e,
                        success: function() {
                            n.success ? n.success() : form_adjuster.ajax_success(), form_adjuster.$form_cur = !1
                        },
                        error: function() {
                            n.error ? n.error() : form_adjuster.ajax_error(), form_adjuster.$form_cur = !1
                        }
                    })
                },
                ajax_success: function() {
                    console.log("success"), form_adjuster.$form_cur && form_adjuster.$form_cur.trigger("reset")
                },
                ajax_error: function() {
                    console.log("error")
                },
                formData_assembly: function(e) {
                    var i, n = new FormData,
                        o = {},
                        s = t(e),
                        r = s.find(":input:not(.js-no-collect),select,textarea"),
                        a = [];
                    i = r.serializeArray();
                    for (var l = 0; l < i.length; l++)
                        if (i[l].value.length > 0) {
                            var c = r.filter("[name=" + i[l].name + "]"),
                                u = {};
                            if ("hidden" == c.attr("type") || c.hasClass("js-system-field")) c.hasClass("js-system-field") || n.append(i[l].name, i[l].value);
                            else {
                                var d = c.attr("data-title");
                                if (c.hasClass("js-work-position")) {
                                    var p = c.closest(".js-add-work-block").find(".js-datepicker-period");
                                    a.push({
                                        value: i[l].value,
                                        period: p.val(),
                                        title: "Данные о месте работы"
                                    })
                                } else s.hasClass("js-only-selected") ? o[i[l].value] = c.closest(".js-wrap").find(".js-counter-input").val() : (u.value = i[l].value, u.title = d, o[i[l].name] = u)
                            }
                        }
                    if (a.length > 0 && (o.position = a), n.append("formData", JSON.stringify(o)), form_adjuster.options.file) {
                        var h = t(e).find(".js-file-check");
                        h.length > 0 && h.each(function() {
                            var e = t(this),
                                i = e.val().length,
                                o = e.prop("multiple");
                            i > 0 && (o ? form_adjuster.collect_multiple_file(n, e) : n.append(e.attr("name"), e[0].files[0]))
                        })
                    }
                    this.form_send(n, !1)
                },
                collect_multiple_file: function(e, i) {
                    var n = i.closest(".js-file-wrapper");
                    n.find(".js-file-list");
                    t(".js-file-list li").each(function() {
                        for (var n = t(this).attr("data-name"), o = 0; o < i[0].files.length; o++) n == i[0].files[o].name && e.append(i.attr("name"), i[0].files[o])
                    })
                },
                check_file: function() {
                    function e(t) {
                        switch (t.target.error.code) {
                            case t.target.error.NOT_FOUND_ERR:
                                alert("File Not Found!");
                                break;
                            case t.target.error.NOT_READABLE_ERR:
                                alert("File is not readable");
                                break;
                            case t.target.error.ABORT_ERR:
                                break;
                            default:
                                alert("An error occurred reading this file.")
                        }
                    }

                    function i(e) {
                        for (var i = t(this), o = 0; o < i[0].files.length; o++) n(i[0].files[o], i)
                    }

                    function n(t, i) {
                        var n = new FileReader,
                            o = t.name,
                            s = i.closest(".js-upload-wrapper"),
                            r = (s.find(".js-filename"), i.closest(".js-input-file-block"));
                        n.file_name = o, n.onerror = e, r.addClass("_onload"), n.onabort = function(t) {
                            alert("File read cancelled")
                        }, n.onload = function(t) {
                            form_adjuster.options.onload ? form_adjuster.options.onload() : form_adjuster.file_onload(i, n)
                        }, n.onprogress = function(t) {
                            if (t.lengthComputable) {
                                var e = parseInt(t.loaded / t.total * 100, 10);
                                s.find(".js-upload-progressbar").css("width", e + "%")
                            }
                        }, n.readAsDataURL(t)
                    }
                    form_adjuster.$file_input.on("change", i)
                },
                file_onload: function(e, i) {
                    if (e.hasClass("js-file-preview")) {
                        var n = e.closest(".js-file-module"),
                            o = n.find(".js-object-fit");
                        n.find(".js-indicator-changes").attr("value", "true"), o.attr("src", i.result), t.fn.objectFitImages(o)
                    } else {
                        var n = e.closest(".js-upload-wrapper"),
                            s = n.find(".js-upload-text");
                        e.closest(".js-input-file-block").removeClass("_onload").addClass("_loaded"), n.addClass("_loaded"), s.text(i.file_name)
                    }
                },
                build_file_structure: function() {
                    form_adjuster.$file_input.each(function() {
                        var e = t(this),
                            i = e.data("params");
                        i = i || {}, e.wrap('<div class="upload-wrapper js-upload-wrapper' + (i.mod ? " upload-wrapper_" + i.mod : "") + '"></div>').after('<div class="upload-wrapper__bar-wrapper"><div class="upload-wrapper__bar js-upload-progressbar"></div></div><span class="upload-wrapper__label"><span class="upload-wrapper__text js-upload-text">' + (i.label ? i.label : "Изменить") + "</span>" + ("simple" === i.mod ? '<span class="cross-btn js-file-reset"></span>' : "") + "</span>")
                    })
                },
                input_file_reset: function() {
                    t(document).on("click", ".js-file-reset", function() {
                        var e = t(this);
                        if (e.hasClass("js-reset-preview")) {
                            var i = e.closest(".js-file-module"),
                                n = i.find(".js-file-check"),
                                o = i.find(".js-object-fit");
                            i.find(".js-indicator-changes").attr("value", "true"), o.attr("src", "").removeAttr("style")
                        } else {
                            var i = e.closest(".js-upload-wrapper"),
                                s = i.find(".js-upload-text"),
                                n = i.find(".js-file-check");
                            i.removeClass("_loaded"), s.text(n.data("params").label)
                        }
                        n.replaceWith(n.val("").clone(!0))
                    })
                },
                init_ajax_without_form: function() {
                    form_adjuster.$btn_without_form.click(function(e) {
                        e.preventDefault();
                        var i = JSON.parse(t(this).attr("data-json"));
                        form_adjuster.form_send(JSON.stringify(i.parameters), i.action)
                    })
                },
                init_btn_no_ajax: function() {
                    form_adjuster.$noajax_btn.click(function(e) {
                        e.preventDefault(), t(this).closest("form").submit()
                    })
                },
                number_only_init: function() {
                    t(document).on("keydown", ".js-number-only", function(t) {
                        46 == t.keyCode || 8 == t.keyCode || 9 == t.keyCode || 27 == t.keyCode || 65 == t.keyCode && !0 === t.ctrlKey || t.keyCode >= 35 && t.keyCode <= 39 || (t.keyCode < 48 || t.keyCode > 57) && (t.keyCode < 96 || t.keyCode > 105) && t.preventDefault()
                    })
                },
                send_validation: function() {
                    this.$form.each(function() {
                        t(this).validate({
                            errorPlacement: function(t, e) {
                                t.remove()
                            },
                            submitHandler: function(e) {
                                form_adjuster.$form_cur = t(e), t(e).hasClass("js-custom-ajax") ? t(e).trigger("custom_ajax") : form_adjuster.formData_assembly(e)
                            }
                        })
                    })
                }
            }
        })
    }, {}],

Александр Мельник

07 апреля 2019, 21:37

Добавьте к тегу form css класс — ajax_form

Андрей

07 апреля 2019, 21:49

Это не обязательно, ajaxForm сам добавляет этот класс автоматически.

Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.

AjaxForm не отправляет письма

Комментарии: 19

Здесь упомянуты