Форма с несколькими кнопками

Главная

Вернуться к статьям

Форма с несколькими кнопками

  1. Добавьте в форму 2 кнопки с действием "отправить форму или перейти к следующему шагу".

  2. Присвойте первой кнопке класс link1, второй - link2, третий link3 и т.д.

  3. Форме присвойте id different-actions и опубликуйте страницу. Действие формы после отправки лучше сделайте "Сообщение", так как перенаправление срабатывает с небольшой задержкой.

  4. Создайте плагин "Свой код" и в поле перед /body вставьте такой код

<script>
cr.api(function (page) {
    const link1 = 'https://google.com';
    const link2 = 'https://yandex.ru';
    const link3 = 'https://yandex.ru';
    const link4 = 'https://yandex.ru';
    const link5 = 'https://yandex.ru';
    page.waitForAppear('#different-actions', el => {
        const form = page.getComponent(el);
        const btns = el.querySelectorAll('.btn[data-action="send"]') let targetLink = ''
        btns.forEach(btn => {
            btn.addEventListener('click', event => {
                if (event.target.closest('.widget-button').classList.contains('link1')) {
                    targetLink = link1;
                } else if (event.target.closest('.widget-button').classList.contains('link2')) {
                    targetLink = link2;
                } else if (event.target.closest('.widget-button').classList.contains('link3')) {
                    targetLink = link3;
                } else if (event.target.closest('.widget-button').classList.contains('link4')) {
                    targetLink = link4;
                } else if (event.target.closest('.widget-button').classList.contains('link5')) {
                    targetLink = link5;
                }
            })
        })
        form.on('submit', () => {
            setTimeout(() => window.location.href = targetLink, 1000);
        })
    })
});
</script>

В строках 2, 3, 4, 5, 6 замените ссылки на нужные вам соответственно первой, второй и последующих кнопок