Передача данных из формы на другую страницу

Чтобы данные передавать с одной страницы (Страница 1) на другую (Страница 2), нужно их сохранять в LocalStorage.

Рабочий пример можно посмотреть по ссылке.

Страница 1

Следующий код сохраняет те поля, у которых в настройках есть класс, начинающийся с export- (export-resultexport-name и т.д.).

 

<script>
cr.api(function (page) {
    // Шаблон класса, которым помечаются сохраняемые поля
    var exportRegExp = /^export-[\w\W-_0-9]+$/;

    // Отслеживаем отправку всех форм
    page.on('form-submit', function (event) {
        event.form.fields.forEach(function (field) {
            // Проверяем, соответствует ли хоть один класс поля шаблону
            field.el.classList.forEach(function (className) {
                // Если соответствует, то...
                if (exportRegExp.test(className)) {
                    // ... сохраняем значение поля в LocalStorage
                    localStorage.setItem(className, JSON.stringify(field.value));
                }
            });
        });
    });
});
</script>

Страница 2

Далее, код, который восстанавливает сохраненные поля.

Чтобы он сработал, нужно:

  1. В настройках формы добавить класс import-from-storage.
  1. В настройках полей добавить соответствующие форме на Странице 1 классы (export-resultexport-name и т.д.).

 

<script>
cr.api(function (page) {
    // Шаблон класса, которым помечаются сохраняемые поля
    var exportRegExp = /^export-[\w\W-_0-9]+$/;

    // Восстанавливаем поля только в формах с классом
    page.lazy('.import-from-storage', function (el) {
        page.getComponent(el).fields.forEach(function (field) {
            // Проверяем, соответствует ли хоть один класс поля шаблону
            field.el.classList.forEach(function (className) {
                // Если соответствует, то...
                if (exportRegExp.test(className)) {
                    // ... достаем сохраненное значение поля
                    var value = JSON.parse(localStorage.getItem(className));

                    // И записываем его в поля
                    if (value !== null) field.setValue(value);
                }
            });
        });
    });
});
</script>

Страница 3, 4...

Можно делать и более сложные связки. Например, на страницу 2 так же добавить код для Страницы 1, а на Страницу 3 добавить код для Страницы 2.

Тогда поля сначала будут передаваться со Страницы 1 на Страницу 2, затем со Страницы 2 на Страницу 3.

ТЕХНИЧЕСКАЯ ПОДДЕРЖКА

Не можете найти то, что ищите?

Напишите нам. на связи 24/7. Среднее время ожидания ответа: 10-15 минут. Также вы можете вступить в наш Телеграм-чат, где собралось много специалистов и пользователей.

Поддержка Creatium

Агенты ответят через 10 минут

Агенты ответят

Блог, курсы и полезные материалы 

Платформа сайтов любой сложности