AjaxForm без jQuery

Приветствую тебя дорогой читатель. Давно хотел это сделать и наконец-то сделал — теперь для работы AjaxForm не нужен jQuery. Для этого нужно
1. Перейти по ссылке.
2. Заменить содержимое папок core/components/ajaxform и assets/componentns/ajaxform/ данными из репозитория.
3. Заменить код сниппета AjaxForm кодом из репозитория.
Если будут ошибки пишите в комментарии, а под катом немного о нюансах.


Немного нюансов.
0. В лексиконы добавлены следующие записи
$_lang['af_message_uploded_progress'] = 'Загружено: ';
$_lang['af_message_uploded_success'] = 'Данные полностью загружены на сервер!';
$_lang['af_message_uploded_error'] = 'Произошла ошибка при загрузке данных на сервер!';
$_lang['af_message_ajax_error'] = 'Форма не была отправлена! Свяжитесь с администратором.';
Первые три параметры отвечают за загрузку файлов, последний будет показан если запрос не попадёт на сервер или если сервер вернёт код ответа не 200.

1. Событие af_complete осталось, но теперь доступ к параметрам осуществляется так
document.addEventListener('af_complete', function (e) {
       e.detail.status; // статус ответа
       e.detail.response; // сам ответ
       e.detail.form; // элемент формы
       e.detail.xhr; // объект запроса        
    });
2. Событие af_complete можно отменить стандартным способом
document.addEventListener('af_complete', function (e) {
       e.preventDefault();
      // тут кастомный код обработки ответа.
    });
3.form теперь это обычный элемент DOM полученный через document.querySelector, поэтому и работать с ней нужно как с DOM элементом.
4. Параметр clearFieldsOnSuccess точно работает, можно отменять перезагрузку формы, для этого нужно передать false без кавычек.
5. Для показа уведомлений нужно установить SweetAlert2.
6. Назначение некоторых функций осталось для меня загадкой, поэтому я просто переписал их на чистый JavaScript.

UPD от 15.02.22: Добавил ссылку на репозиторий для помощи в поиске ошибок и рефакторинге.
UPD от 07.03.22:
Добавил новые параметры сниппета AjaxForm:
Если в форме есть input[type=«file»]
1. fileUplodedProgressMsg — сообщение, которое будет показано во время загрузки файлов.
2. fileUplodedSuccessMsg — сообщение об успешном завершении загрузки файлов.
3. fileUplodedErrorMsg — сообщение об ошибке при загрузке файлов, не путать с сообщением от валидатора файлов, если такой у вас есть.
4. showUplodedProgress — по умолчанию false, т.е. прогресс загрузки не показывается, если нужно включить показ прогресса ставим true. Соответственно добавлены методы обработки процесса загрузки файлов в default.js, они называются onUploadProgress, onUploadFinished, onUploadError;

Так же в отдельные методы вынес обработку ошибок валидации (onError) и успешной отправки формы (onSuccess).

Всю логику можно переопределить, для этого в конструкторе класса core/components/ajaxform/model/ajaxform/ajaxform.class.php я переопределил конструктор, теперь можно в системные настройки добавить свои пути к стилям и скриптам через настройки af_frontend_css и af_frontend_js соответственно. Правда выпилить стандартные параметры сниппета не могу, поэтому, в целом, данный функционал не работает.

UPD от 09.03.22:
При наличии на странице более одного вызова AjaxForm обязательно указывать параметр formSelector. Он должен быть уникальным для каждой формы, в противном случае каждая форма будет отправляться более 1 раза. Уникальный селектор генерируется автоматически. ВАЖНО! И это не я придумал, селектор это всегда название класса указанное без точки. Если нужно чтобы применились стили по умолчанию в форму руками надо добавить класс ajax_form. Скорее всего я этот момент доработаю, но это неточно.
UPD от 12.03.2022
Класс ajax_form добавляется автоматически ко всем формам.

UPD от 29.04.2022
Нашел способ передавать произвольный обработчик уведомлений. Чтобы добавить свой обработчик нужно создать минимум 1 системную настройку с именем af_message_handler с названием класса обработчика. В этом классе должны быть реализованы методы error, success, close и info. Можно сгруппировать эти методы, как это сделано в SweetAlert2, в этом случае нужно создать ещё одну системную настройку с именем af_message_handler_method где должно быть указано название подметода. Например, если ваш класс выводит сообщение так
MessageHandler.success(message);
то MessageHandler должно быть значением af_message_handler. Если вывод сообщения происходит так
MessageHandler.Method.success(message);
то MessageHandler должно быть значением af_message_handle, а Method значением af_message_handler_method.
Однако, это всё только в теории, на практике я не проверял, но SweetAlert2 работает.
Артур
14 февраля 2022, 21:53
modx.pro
7
890
+14
Поблагодарить автора Отправить деньги

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

Sergey (Sentinel)
14 февраля 2022, 22:09
+1
    Артур
    14 февраля 2022, 22:18
    +1
    Я не уверен, что без уведомлений его примут. Хотя с другой стороны, попытка не пытка. Но уже завтра.
      Sem
      Sem
      15 февраля 2022, 12:14
      +2
      Я бы не спешил с пулреквестом, так как скрипт написан с ошибками.
      Хорошо бы его сначала протестить по-полной, но за решительный шаг, наконец-то избавить компонент от jQuery — уважуха!
      Сейчас тестирую скрипт, где-то лезут ошибки в браузер из-за недостающих проверок на существование элементов, что джеквери делает под капотом.
      Так же хорошо, что убран функционал с уведомлениями, он должен быть опциональным, но проверки на него тоже выкидывают ошибки в консоль.
      Автору благодарность, ошибки не критичные, легко все пофиксить
        Артур
        15 февраля 2022, 12:20
        +1
        Я не сомневался, что там не всё идеально))) У себя проверял ошибок не было. Не знаю как лучше поступить в этом случае, отдельный репозиторий делать, чтобы могли туда правки вносить?
          Sem
          Sem
          15 февраля 2022, 12:28
          +1
          Да идея неплохая, так сможем всем сообществом довести скрипт до ума, а потом предложим в пулреквест
            Артур
            15 февраля 2022, 12:29
            +1
            Ну ок.
    Евгений Webinmd
    15 февраля 2022, 16:16
    0
    У минишопа Николай сделал отличный функционал уведомлений, можно глянуть для примера
      Артур
      15 февраля 2022, 18:49
      0
      Ну как бы стандартные методы показа уведомлений я оставил, т.е. AjaxForm.Message.success и AjaxForm.Message.error никуда не делись, просто я выпилил создание объекта AjaxForm.Message поэтому по умолчанию сообщения показываться не будут. Если лень возиться с подключением своих уведомлений, можно поставить SweetAlert2, либо определить объект AjaxForm.Message и подключить свои уведомления. Но с последним вариантом засада, т.к. хорошо бы сделать системную настройку которая бы хранила путь к файлу с уведомлениями и надо допилить сниппет, чтобы он эту настройку подхватывал если она указана. И тогда по умолчанию можно что-то подключить.
      Николай Савин
      18 февраля 2022, 06:17
      +1
      А почему у тебя в объекте методы внутри метода? Это же нелогично. Вынеси их в корень объекта. Для чего нужна вложенность?
      И я правильно понимаю, что в твоем варианте оригинальный ajaxForm все равно нужно подключать, а потом этой штукой перезаписывать метод initialize?
        Артур
        18 февраля 2022, 10:38
        +1
        А почему у тебя в объекте методы внутри метода? Это же нелогично. Вынеси их в корень объекта. Для чего нужна вложенность?
        Да ни для чего))) Это пробный шар, мне для тренировки, сообществу для пользы.
        И я правильно понимаю, что в твоем варианте оригинальный ajaxForm все равно нужно подключать, а потом этой штукой перезаписывать метод initialize?
        Да. В идеале сделать pr и из коробки загружать этот код, но для этого нужно его до ума до вести.
          Николай Савин
          18 февраля 2022, 10:41
          0
          PR в таком виде у тебя не примут. Нет смысла слать.
            Артур
            18 февраля 2022, 10:50
            0
            Я догадывался поэтому и не послал)))
        Кирилл Киселев
        18 февраля 2022, 09:38
        0
        Ого. Давно хотел перебить на ванилу все связанные плагины с ms2, но руки не доходили, видимо не я один такой, кто хочет все на ванилу переписать, спасибо тебе!
          Артур
          18 февраля 2022, 10:45
          +1
          Есть мнение и я с ним согласен, что jQuery морально устарела и большинство тех возможностей, из-за которых все ей пользовались, реализованы в нативном js. А весит jQuery очень много и когда у тебя лэндос, где только отправка формы и нужна невольно закрадывается мысль, что jQuery это лишнее 😀
          Баха Волков
          18 февраля 2022, 09:59
          +3
          Что-то вчера захотелось переписать самому, но потом перехотел, а так хотя бы толкну тебя в нужном направлении

          class AjaxForm {
              constructor (config) {
                  this.forms = document.querySelectorAll(config['formSelector'])
              }
          
              resetErrors (e) {
                  // some code
              }
          
              success () {}
          
              sendAjax () {}
          }
          
          new AjaxForm(afConfig)
            Артур
            18 февраля 2022, 10:40
            0
            Спасибо, я забыл, что так можно было. Перепишу. Заодно и замечания Николая Савина учту.
              Артур
              07 марта 2022, 15:00
              +1
              Наконец-то дошли руки. Переписал. Если будет минутка — посмотри в репозитории код.
                Николай Савин
                07 марта 2022, 15:03
                +1
                1. Логику из конструктора хорошо бы вынести в отдельный метод.
                2. Старайся использовать const вместо let
                3. Я бы заменил XHR на fetch.
                4. А разве не должно быть метода error для работы с ошибками?
                  Артур
                  07 марта 2022, 15:31
                  0
                  4. А разве не должно быть метода error для работы с ошибками?
                  Может быть и должен быть, но в оригинальном скрипте не было, вроде бы. Расскажи подробнее, что должен делать метод, я постараюсь его написать.
                    Николай Савин
                    07 марта 2022, 16:19
                    0
                    А я не смотрел оригинальный файл. По логике если есть success должен быть и error
                    Success выводит уведомления об успешных транзакциях $ajaxForm->success()
                    Error соответственно в случае $ajaxForm->error()
                      Артур
                      07 марта 2022, 20:43
                      0
                      Вынес в отдельный метод. Ошибку самого запроса выносить не стал, потому как пользователь всё равно повлиять не её исправление не может.
                    Артур
                    07 марта 2022, 15:35
                    0
                    2. Старайся использовать const вместо let
                    А это зачем?
                      Николай Савин
                      07 марта 2022, 16:20
                      0
                      Общепринятые правила написания кода.
                        Stanislavsky
                        15 марта 2022, 09:33
                        0
                        Если твои значения переменных не изменяются в методе, то const. let, если изменяются.
                          Александр Мельник
                          15 марта 2022, 10:08
                          +1
                          И все же, это не является ни стандартом, ни требованием, можно сказать что это лишь вялая рекомендация.
                          По сути использование const не дает никакой выгоды перед let, как это например наблюдается в других языках, где если объявляется константа, то под нее в памяти резервируется минимально необходимое количество байт.
                          В javascript использование const не более чем попытка пойти по модному течению «сейчас в моде снова языки строгой типизации». Раньше был турбо паскаль, фортран, позже с++, джава в которых нельзя было обьявить переменную не указав точно тип данных, которые мы планируем в ней хранить.
                          int var x = 5;
                          Потом мода менялась и стали говорить мол, вот вам новые языки, здесь не нужно думать о типе переменной, творите что хотите, теперь вы свободны и появились php, javascript и прочее.
                          Сейчас же (лично по моим наблюдениям) новый виток спирали — снова в моду входит строгая типизация. Javascript разрабатывает typescript, php вводит typehinting, позволяет указывать что должна вернуть функция, в общем становится очень похож на с++.
                          И const в javascript (на мой взгляд) не более чем баловство, ведь работает это только на примитивных данных, а для ссылочных типов данных работает некорректно, тоесть позволяет мутировать объект. Поэтому мне кажется, кому нужна строгая типизация тот пойдет писать на typescript, а остальным без разницы let или const, хотя может я и ошибаюсь.
                            Артур
                            15 марта 2022, 11:51
                            0
                            Я это знаю и в целом стараюсь придерживаться данного правила, в данном случае в том числе. Просто @Николай Савин сказал так, что мне показалось будто бы он призывает все let поменять на const, вот я и спросил зачем.
                          Артур
                          07 марта 2022, 16:04
                          0
                          3. Я бы заменил XHR на fetch.
                          Может быть когда-нибудь потом)))
                            Дима Сайт
                            07 марта 2022, 16:30
                            0
                            А вот если смотреть со стороны сервера, то XHR можно задетектить по заголовкам (типа is_ajax() в modhelpers, а Fetch-запрос вроде никак не спалить (и если он хочет, чтобы его узнали, то должен сам «представиться», передав ещё параметр например). Строго говоря, с точки зрения обработки запроса на стороне сервера, у XHR здесь преимущество перед Fetch.

                            Или я чего-то не знаю?
                              Артур
                              07 марта 2022, 16:37
                              0
                              Я не знаю, но я точно знаю, что завести компонент с Fetch у меня не получилось, а разбираться в причинах не охота.
                                Николай Савин
                                07 марта 2022, 16:49
                                0
                                Скорее всего ты чего-то не знаешь.
                                Смотри jquery ajax() подписывает свои запросы заголовком X-Requested-With со значением XMLHttpRequest

                                И многие компоненты, в том числе упомянутый modhelpers просто проверяют наличие заголовка
                                if (empty($_SERVER['HTTP_X_REQUESTED_WITH']) || $_SERVER['HTTP_X_REQUESTED_WITH'] != 'XMLHttpRequest') {return;}
                                Выходит Чтобы все серверные скрипты сработали — достаточно передать этот заголовок

                                В конкретно этом ajaxForm за авторством Артура сделано вот так
                                request.setRequestHeader("X-Requested-With", "XMLHttpRequest");
                                Fetch работает точно так же. Нужно передать заголовок. Просто синтаксис чуть другой будет
                                const headers = {'X-Requested-With':XMLHttpRequest}
                              Артур
                              07 марта 2022, 16:07
                              0
                              1. Логику из конструктора хорошо бы вынести в отдельный метод.
                              Переписал конструктор.
                              Баха Волков
                              09 марта 2022, 09:53
                              +3
                              Опа, а это уже лучше. Пара советов, если позволишь:

                              1. Можно учитывать, что конфиг может по какой-то причине не будет доступен или он придёт неполным

                              constructor (config) {
                                  this.defaults = {
                                      someProp: true,
                                      anotherProp: 'long string',
                                  }
                              
                                  this.config = Object.assign({}, this.defaults, config);
                              }

                              и далее в коде методов ты не будешь париться и обращаться к конфигу так:

                              this.config.someProp

                              2. Обычно принято в мире js передавать селектор первым аргументом, а вторым конфиг плагина, это намного удобнее, и я понимаю, что AjaxForm в оригинале такой и ты просто перевел код, но тут заодно можно и это исправить:

                              class AjaxForm {
                                  constructor (selector, config) {
                                      if (!selector) {
                                          console.error('Нет селектора');
                                      }
                                      
                                      this.defaults = {
                                          someProp: true,
                                          anotherProp: 'long string',
                                      }
                                  
                                      this.config = Object.assign({}, this.defaults, config);
                              
                                      this.forms = document.querySelectorAll(selector);
                                  }
                              }
                              
                              // И теперь можно вызывать и с конфигом и без
                              new AjaxForm(selector, config);
                              new AjaxForm(selector);

                              3. У тебя на 20-ой строке есть странность if (this.beforeSubmit(e.target)) { и судя по коду твой метод beforeSubmit всегда возвращает true, тогда я понятия не имею зачем тут проверка.
                                Артур
                                09 марта 2022, 23:44
                                0
                                В общем, по п.2 переписал, только логику немного изменил. Поскольку я научил класса, который на сервере, генерировать уникальный селектор, класс в JS теперь всегда работает с одной конкретной формой, поэтому я в конструкторе сделал так
                                this.form = document.querySelector(selector);
                                
                                        if (!this.form) {
                                            console.error('Form not found. Check the correctness of the selector.');
                                            return false;
                                        }
                                Если нет формы, то нет смысла и дальше что-то делать. Тут вылез ещё один интересный момент, уже в сниппите. Там есть вот такой кусок кода
                                // Add selector to tag form
                                if (preg_match('#<form.*?class=(?:"|\')(.*?)(?:"|\')#i', $content, $matches)) {
                                    $classes = explode(' ', $matches[1]);
                                    if (!in_array($formSelector, $classes)) {
                                        $classes[] = $formSelector;
                                        $classes = preg_replace(
                                            '#class=(?:"|\')' . $matches[1] . '(?:"|\')#i',
                                            'class="' . implode(' ', $classes) . '"',
                                            $matches[0]
                                        );
                                        $content = str_ireplace($matches[0], $classes, $content);
                                    }
                                } else {
                                    $content = str_ireplace('<form', '<form class="' . $formSelector . '"', $content);
                                }
                                По-моему, он устарел, проще прямо в чанк передавать весь конфиг и устанавливать селектор так {$formSelector} или так [[+formSelector]]. Хотя с другой стороны, ну есть и есть, да?

                                И ещё в оригинальном сниппите сделано вот так
                                <?php
                                /** @var array $scriptProperties */
                                /** @var AjaxForm $AjaxForm */
                                if (!$modx->loadClass('ajaxform', MODX_CORE_PATH . 'components/ajaxform/model/ajaxform/', false, true)) {
                                    return false;
                                }
                                $AjaxForm = new AjaxForm($modx, $scriptProperties);
                                
                                $snippet = $modx->getOption('snippet', $scriptProperties, 'FormIt', true);
                                $tpl = $modx->getOption('form', $scriptProperties, 'tpl.AjaxForm.example', true);
                                $formSelector = $modx->getOption('formSelector', $scriptProperties, 'ajax_form', true);
                                $objectName = $modx->getOption('objectName', $scriptProperties, 'AjaxForm', true);
                                Мне кажется это нелогично, ведь создавая экземпляр класса, мы мерджим дефолтный конфиг и $scriptProperties, т.е. на мой взгляд, в getOption нужно писать так
                                $snippet = $modx->getOption('snippet', $config, 'FormIt', true);
                                $tpl = $modx->getOption('form', $config, 'tpl.AjaxForm.example', true);
                                $formSelector = $modx->getOption('formSelector', $config, 'ajax_form', true);
                                $objectName = $modx->getOption('objectName', $config, 'AjaxForm', true);
                                Или я чего-то не понимаю?
                                Баха Волков
                                09 марта 2022, 09:57
                                0
                                Ну и можно по стандартам пройтись :|
                                  Артур
                                  09 марта 2022, 13:15
                                  0
                                  Пара советов, если позволишь:
                                  Не просто позволю, а ещё и благодарен буду)))

                                  и далее в коде методов ты не будешь париться и обращаться к конфигу так:
                                  Ну вообще запись станет длиннее this.config.someprop против this.someprop, но я доверюсь твоему опыту.

                                  Обычно принято в мире js передавать селектор первым аргументом, а вторым конфиг плагина
                                  Тут отдельная проблема. В конструктор надо передавать уникальный селектор, потому что в противном случае если на странице больше 1 вызова AjaxForm обработчики навешиваются столько раз сколько вызывается сниппет, а это плохо по понятным причинам. И передавать селектор в каждом вызове мне кажется неудобным. Я думаю надо установить селектор по умолчанию и дополнять его меткой времени и тоже самое делать с переданным селектором, чтобы на 100% исключить вероятность дублирования или есть варианты решения получше?

                                  3. У тебя на 20-ой строке есть странность if (this.beforeSubmit(e.target)) { и судя по коду твой метод beforeSubmit всегда возвращает true, тогда я понятия не имею зачем тут проверка.
                                  Это у меня он возвращает true, а если кто-то захочет свою логику, например не отправлять пока не прочитают политику работы с персональными данными?

                                  Ну и можно по стандартам пройтись :|
                                  Я самоучка, это не оправдание, но что значит пройтись по стандартам не понимаю.

                                  И есть ещё один момент — уведомления
                                  if (AjaxForm.Message != 'undefined') {
                                      AjaxForm.Message.close();
                                  }
                                  Это я оставил для обратной совместимости, но это объект, мне кажется правильнее было бы сделать показ сообщения методом или методами класса, но как туда впихнуть код выше? Тут предлагали сделать как @Николай Савин в minishop2, но у него это тоже объект. Может уведомления сделать отдельным классом? Добавить из коробки уведомления не требующие jQuery, только вот надо же ещё дать возможность подключать произвольные уведомления, но как это лучше сделать?
                                    Баха Волков
                                    10 марта 2022, 12:28
                                    0
                                    Ну вообще запись станет длиннее this.config.someprop против this.someprop, но я доверюсь твоему опыту.
                                    Запись (а точнее доступ к конфигу) станет длиннее, но заметь, с такой записью у тебя как минимум минус несколько строчек в конструкторе, ну и конфиг не будет путаться на первом уровне класса.

                                    Тут отдельная проблема. В конструктор надо передавать уникальный селектор, потому что в противном случае если на странице больше 1 вызова AjaxForm обработчики навешиваются столько раз сколько вызывается сниппет, а это плохо по понятным причинам. И передавать селектор в каждом вызове мне кажется неудобным. Я думаю надо установить селектор по умолчанию и дополнять его меткой времени и тоже самое делать с переданным селектором, чтобы на 100% исключить вероятность дублирования или есть варианты решения получше?
                                    А тут самое простое решение, это при навешивании обработчика проверять например css класс af_initialized, а уже после добавить к форме этот класс.

                                    Это у меня он возвращает true, а если кто-то захочет свою логику, например не отправлять пока не прочитают политику работы с персональными данными?
                                    Теперь понял

                                    Я самоучка, это не оправдание, но что значит пройтись по стандартам не понимаю.
                                    Это наверное потом, когда вдруг захочешь сделать PR
                                      Артур
                                      10 марта 2022, 14:36
                                      0
                                      А тут самое простое решение, это при навешивании обработчика проверять например css класс af_initialized, а уже после добавить к форме этот класс.
                                      Отличный вариант, жаль сам не додумался. Но надо ли переделывать? Сейчас, как я уже писал, класс работает только с одной формой, потому как я генерирую уникальный селектор.

                                      Это наверное потом, когда вдруг захочешь сделать PR
                                      Я уже скоро захочу, уведомления только прикручу))) Вдруг кому-то ещё надо, чтобы не было jQuery. Или может сделать форк?
                              Александр Быковский
                              12 марта 2022, 01:25
                              0
                              Здравствуйте.
                              Заменил default.js и core/components/ajaxform/model/ajaxform/ajaxform.class.php

                              При загрузке страницы ошибка:
                              default.js:7 Form not found. Check the correctness of the selector.
                              При отправке происходит перезагрузка страницы. Форма не отправляется, журнал ошибок пуст
                                Артур
                                12 марта 2022, 13:27
                                0
                                Забыл написать про то, что код сниппета тоже надо заменить. Дело в том, что в сниппет передавался массив параметров $scriptProperties, затем создавался экземпляр класса, где в конструкторе эти параметры объединялись с дефолтной конфигурацией, но дальше по коду почему-то использовались параметры $scriptProperties, а не конфигурация экземпляра класса. Это поведение я изменил вот так:
                                $AjaxForm = new AjaxForm($modx, $scriptProperties);
                                $config = $AjaxForm->config;
                                
                                $snippet = $modx->getOption('snippet', $config, 'FormIt', true);
                                $tpl = $modx->getOption('form', $config, 'tpl.AjaxForm.example', true);
                                $formSelector = $modx->getOption('formSelector', $config, 'ajax_form', true);
                                $objectName = $modx->getOption('objectName', $config, 'AjaxForm', true);
                                  Александр Быковский
                                  12 марта 2022, 14:07
                                  0
                                  я правильно понимаю, что код сниппета можно взять из файла snippet.ajaxform.php в вашем репозитории ajaxform_without_jquery на гитхаб?
                                    Артур
                                    12 марта 2022, 15:01
                                    +1
                                    Да, именно там можно взять.
                                    Николай Савин
                                    12 марта 2022, 21:55
                                    0
                                    Pull Request будешь делать?
                                      Артур
                                      13 марта 2022, 00:09
                                      0
                                      Да, только я не знаю достаточно ли хорош код для этого?
                                        Николай Савин
                                        13 марта 2022, 08:24
                                        0
                                        Знаешь как мне страшно в Minishop PR слать. Более того — я точно знаю, что мой код фигня полная, по сравнению с тем что делают старшие товарищи. Но это хоть какой то движ.
                                          Артур
                                          13 марта 2022, 14:55
                                          0
                                          Понял тебя, зашлю на днях)))
                                            Артур
                                            13 марта 2022, 18:51
                                            0
                                            Заслал.
                                              Николай Савин
                                              13 марта 2022, 19:04
                                              0
                                              Спасибо. Выберу время проверю хорошенько.
                                                Артур
                                                13 марта 2022, 20:18
                                                0
                                                Хорошо. Буду ждать.
                                    Александр Быковский
                                    22 марта 2022, 12:47
                                    0
                                    По всей видимости на айфонах не работает. Связка AjaxForm (без JQ) + FormIt + SweetAlert2.
                                    Тестировал отправку на Windows, Chrome Android — всё отправляется.
                                    На айфонах (реальных) + тест в Browserstack — форма не отправляется.
                                      Артур
                                      22 марта 2022, 14:59
                                      0
                                      Да, спасибо, я вспомнил iphone не любит let, надо заменить на var.
                                        Александр Быковский
                                        22 марта 2022, 15:11
                                        0
                                        Заменил в файле *.js let на var. Безрезультатно(
                                          Артур
                                          23 марта 2022, 13:37
                                          0
                                          Странно. Значит дело не в этом.
                                          Николай Савин
                                          22 марта 2022, 18:01
                                          0
                                          iphone не любит let, надо заменить на var.
                                          ЧТООО?? Артур не говори ерунды. По этой логике не один сайт бы не работал.
                                            Артур
                                            23 марта 2022, 13:40
                                            0
                                            Согласен звучит бредово, но я реально не понимаю почему на ios может не работать. У меня была похожая ситуация с другим скриптом, там замена на var помогла. Думаю дело в области видимости, но вот что конкретно… Ладно будет время поковыряю этот момент.
                                              Николай Савин
                                              23 марта 2022, 13:59
                                              0
                                              Давай будем корректны — Как бы Ios сам по себе ничего не рендерит. Это вопросы к движку браузера тогда уж.
                                                Артур
                                                23 марта 2022, 14:07
                                                0
                                                Ну да, к сафари вопрос.
                                                  Александр Быковский
                                                  23 марта 2022, 14:49
                                                  0
                                                  изначально тестировал на хроме, потом уж сафари (всё ios). Ни там ни там
                                                    Артур
                                                    23 марта 2022, 18:05
                                                    0
                                                    Вооот ещё одна странность.
                                            Александр Быковский
                                            23 марта 2022, 09:00
                                            0
                                            Для чистоты эксперимента переключил работу дополнения в дефолтный режим. Форма на айфонах отправляется и проходит валидацию




                                            По моим наблюдениям в режиме nojq затык происходит в момент отправки запроса: форма будто бы замирает, либо пытаясь отправить данные, либо ожидая ответа от сервера
                                              Артур
                                              23 марта 2022, 13:41
                                              0
                                              Спасибо за подробности, пока нет времени разбираться, но как появится погляжу.
                                          Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
                                          60