Как к форме прикрутить редирект после заполнения и отправки данных?

Question

[antishock]

Имеется форма с сервиса sendpulse. Нужно, чтобы после нажатия на кнопку формы, отправлялись данные на сервер и после этого происходило перенаправление на другую страницу.

Если делать через onclick, то происходит немедленное перенаправление и данные не отправляются на сервер.

<script type="text/javascript">    document.getElementById("button14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906").onclick = function () {
        location.href = "www";
    };
</script>

Код самой формы:

spoiler

<div id="14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906"
    style=
    "margin:auto;max-width:350px !important;background-color: #f1f1ee !important;border-style: solid !important;border-width: 1px !important;border-color: #801a15 !important;border-radius: 5px !important;font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif !important;">
    <link href=
    "https://login.sendpulse.com/js/intlTelInput/intlTelInput.css?v=1462453378"
        media="screen" rel="stylesheet">
        <style>
        .14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906_form_line p,.14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906_form_line h1,.14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906_form_line h2,.14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906_form_line h3,.14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906_form_line h4,.14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906_form_line h5,.14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906_form_line h6{margin:0!important;color:inherit!important;font:inherit!important;}
        </style><input name="sform[hash]" type="hidden" value=
        "14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906">
        <div class=
        "14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906_form_line">
        <div style=
        "padding: 30px !important;padding-top: 20px !important;padding-bottom: 15px !important;background-color: #a0a1a3 !important;border-radius: 4px 4px 0px 0px !important;">
            <div style=
            "display: inline-block !important;vertical-align: top !important;word-wrap: break-word !important;text-align: center !important;color: #ffffff !important;width: 100% !important;font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif !important;font-size: 24px !important;font-weight: normal !important;">
                <h3>Скачайте книгу!</h3>
                </div>
            </div>
            <div style=
            "text-align: left !important;padding: 5px !important;border-radius: 4px 4px 0px 0px !important;">
            <div style="display: inline-block;width: 89%;">
                    <div style=
                    "margin-bottom: 5px;font-family: Arial,'Helvetica Neue',Helvetica,sans-serif; !important;font-size: 12px !important;font-weight: bold !important;color: #B2B2B2 !important;text-align: left !important;">
                    </div>
                    <div style="">
                        <input class=
                        "14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906_text"
                        maxlength="255" name="sform[0JjQvNGP]" placeholder=
                        "Имя" required="required" style=
                        "width:100%;max-width:210px;padding: 5px !important;border-width: 1px !important;border-style: solid !important;border-color: #eeeeee !important;font-family: Arial,'Helvetica Neue',Helvetica,sans-serif; !important;font-size: 12px !important;font-weight: normal !important;color: #666 !important;">
                    </div>
                </div>
            </div>
        </div>
        <div class=
        "14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906_form_line">
        <div style="padding: 5px !important;">
                <div style="display: inline-block;">
                    <div style=
                    "margin-bottom: 5px;font-family: Arial,'Helvetica Neue',Helvetica,sans-serif; !important;font-size: 12px !important;font-weight: bold !important;color: #B2B2B2 !important;text-align: left !important;">
                    </div>
                    <div style="">
                        <input class=
                        "14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906_email"
                        maxlength="255" name="sform[email]" placeholder=
                        "Ваш email" required="required" style=
                        "width:210px;padding: 5px !important;border-width: 1px !important;border-style: solid !important;border-color: #eeeeee !important;font-family: Arial,'Helvetica Neue',Helvetica,sans-serif; !important;font-size: 12px !important;font-weight: normal !important;color: #666 !important;"
                        type="email">
                    </div>
                </div>
            </div>
        </div>
        <div class=
        "14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906_form_line">
        <div style=
        "text-align: center !important;padding: 5px !important;padding-top: 5px !important;padding-bottom: 5px !important;">
            <div style="display: inline-block;">
                    <button id=
                    "button14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906"
                    onclick=
                    "sform14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906._button(this);"
                    style=
                    "text-decoration: none; border-style: solid; text-align: center; border-collapse:inherit;background: linear-gradient(#f97779, #ce2424) repeat scroll 0 0 rgba(0, 0, 0, 0);border-color: #be2424 #be2424 #bd2524;border-image: none;border-style: solid;border-width: 1px 1px 3px;box-shadow: 0 0 0 1px #e67e7b inset;color: #fff;text-shadow: 0 1px 0 #bd2524;color: #FFFFFF !important;font-family: Arial,'Helvetica Neue',Helvetica,sans-serif !important;font-size: 22px !important;font-weight: normal !important;background-color: #B2B2B2 !important;border-radius: 5px !important;width: 240px !important;height: 40px !important;cursor: pointer;border-width: 1px;border-style: solid;padding: 5px;">
                    Скачать</button>
                </div>
            </div>
        </div>
        <div class=
        "14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906_form_line">
        <div style=
        "padding: 5px !important;padding-top: 5px !important;padding-bottom: 5px !important;">
            <div style=
            "display: inline-block !important;vertical-align: top !important;word-wrap: break-word !important;text-align: center !important;color: #b2b2b2 !important;width: 100% !important;font-family: Arial,'Helvetica Neue',Helvetica,sans-serif !important;font-size: 14px !important;font-weight: normal !important;">
                <img alt="email рассылки" src=
                "https://login.sendpulse.com/img/lock.png"> Конфиденциальность
                гарантирована
                </div>
            </div>
        </div>
        <div id=
        "_plain_message14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906"
        style="display:none;"></div>
        <div>
            <div style=
            "display: inline-block !important;text-align: center !important;width: 100% !important;font-size: 12px !important;font-family: Arial,'Helvetica Neue',Helvetica,sans-serif !important;color='#2A6496' !important;padding: 10px !important;font-weight:normal !important;border-radius: 0px 0px 4px 4px !important;">
            <a href="https://sendpulse.com/?rg=4&uid=637076"><img alt=
            "email рассылки" src=
            "https://login.sendpulse.com/img/logoimage.png" style=
            "width:100px"></a>
            </div>
        </div>
    </div>
    <script src=
    "https://login.sendpulse.com/members/forms/user-form-js/ac/14210812bd47b026a8cd0ace092c3aa288c64e7bb264104d5c872d42bb923906/c/1/"
    type="text/javascript">
    </script>
    <script type="text/javascript">
    var sform_lang = 'ru'
    </script>

Как это можно реализовать?

Answer 1

[antishock]

Нашел как можно повесить два события на onclick, но не понимаю, как записать правильно в функцию отправление данных с формы

<input type="button" value="клик" onclick="one(); two();" />

<script>
function one() {
    alert('Здравствуйте');
}

function two() {
    alert('Ещё раз привет');
}
</script>

Comments

[denikeev90]

Вы случайно не нашли решение?

[denikeev90]

А если редирект как-нибудь повесить на таймер? Например через сколько-нибудь милисекунд?

[denikeev90]

Я вот делаю так: Подписчиков собираю на бесплатном аккаунте unisender (где лимит до 100 адресов),
Потом как поднакопится перевожу их в список sendpulse . Колхоз конечно... но что делать....

[antishock]

нашел. пришлось просто скачать файл, в нем дописать переадресацию и сослаться на него напрямую, а не через сервис

[denn70]

antishock: не уточните как именно решили проблему с сендпульсом, не совсем понял какой файл файл скачали и как дописали редирект)

[antishock]

denn70: в самом низу после формы между тегами script есть файл

src="https://login.sendpulse.com/members/forms/user-form-js/ac/........"

[antishock]

denn70: в этом месте дописать одну строчку window.location = "http://";

if  (response.status=='success' || response.status=='notify') {
            var inpfl = jQuery( 

.............................................


                        jQuery(inpfl[indx]).show();
						window.location = "http://";
                    }
                }
            });

[denn70]

antishock: Спасибо за огромное за ответ, работает!!! )))

Answer 2

[Дмитрий Еремин]

<form name="form1" id="form1" method="post" action="#" onsubmit="return  checkForm()">

серверный код в файле должен быть ниже JS-кода (почему так - хз)

Взято отсюда: stackoverflow.com/questions/34014350/calling-javas...

Comments

[antishock]

В том варианте, судя по всему, PHP и JS имеют разную очередность исполнения. В моем случае PHP нету. Пробовал еще с помощью setTimeout отложить исполнение редиректа, но не срабатывает.

[Дмитрий Еремин]

так если пхп нету, то просто name="form1" id="form1" method="post" onsubmit="return checkForm()"

[antishock]

Дмитрий Еремин: Проблема в том, что эту форму генерирует сервис sendpulse, а она сделана по странному, поля вставлены в div, а не form и просто обрамить в этот тег не получается, форма перестает работать.

[Дмитрий Еремин]

antishock: вон оно че

[denn70]

и как быть то?