Почему скрипт не работает внутри веб-формы?

Question

Я пытаюсь отправить скрытую форму из Marketo, со значениями формы из другой формы (веб-формы), загруженными через JSP.

Скрипт работает нормально, когда для обычной формы HTML. Это не работает с формой JSP. Мне нужна помощь в устранении неполадок кода.

<script src="//app-lonXX.marketo.com/js/forms2/js/forms2.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<form id="mktoForm_1052"></form>

<div class="contactForm">

    <form id="JSP_form" class="webtrekkHelper_configs eineSeite" data-mwf-target="/formulare/servlet/form;webforms=E905F54C7DEDE98AAC26DA1B799E5CA3.node01?_uid=DEsk2_form&amp;lang=de_DE&amp;_view=webform" data-mwf-id="JSP_form" action="/formulare/servlet/form;webforms=E905F54C7DEDE98AAC26DA1B799E5CA3.node01" method="post" enctype="multipart/form-data" accept-charset="utf-8" onsubmit="return false;">
        <input type="hidden" name="audience" value="UIP">
        <input type="hidden" name="revisionNr" value="96365">

        <div id="form-top"></div>

        ...form fields

        <div class="">

            <!-------- I WANT TO RUN THIS SCRIPT ON SUBMIT "JSP_form" ------------>

            <script>
                MktoForms2.loadForm("//app-lonXX.marketo.com", "4XX-XXX-XXX", 1052);
                document.addEventListener("DOMContentLoaded", function(event) {
                    var customForm = document.querySelector("#JSP_form"),
                        customFormButton = customForm.querySelector("input[type='button']");
                    if (customFormButton != null) {
                        customFormButton.addEventListener("click", function(customFormSubmitEvent) {
                            customFormSubmitEvent.preventDefault();
                            customFormButton.disabled = true;
                            MktoForms2.whenReady(function(mktoForm) {
                                mktoForm.addHiddenFields({
                                    "Salutation": customForm.querySelector("#mwf8322014b47ad_Frau:checked").value || customForm.querySelector("#mwf8322014b47ad_Herr:checked").value || customForm.querySelector("#mwf8322014b47ad_Divers:checked").value || false,
                                    "FirstName": customForm.querySelector("#mwfca1d8fb14840").value,
                                    "LastName": customForm.querySelector("#mwf2e0f8bf4c5a5").value

                                });
                                mktoForm.submit();
                            });
                        });
                    }
                });
            </script>

            <!-----------------BUT UNFORTUNATELY IT IS NOT RUNNING (No "POST" Event on form submission)-------------------------->

            <ul>

                <li data-mwf-container="_finish_mwf9ee817e83aae" class="mwf-button mwf-next">
                    <input type="button" value="Submit" data-mwf-submit="{&quot;type&quot;:&quot;finish&quot;}" class="webtrekkHelper_observe" data-webtrekk-formsubmit="" data-webtrekk-linkid-area="Content" data-webtrekk-linkid-element="Button" data-webtrekk-linkid-name="Submit" data-webtrekk-linkid-target-append-base-contentid=".Bestätigung_Sparplankampagne_Beratung">
                </li>

            </ul>

            <ul>
                <li class="mwf-pager">
                    <p>
                        <span>1</span>/<span>2</span>
                    </p>
                </li>
            </ul>
        </div>
    </form>

    <script type="text/javascript">
        try {
            jQuery('#JSP_form').webforms({
                        "onSubmit": function(data, textStatus, xhr) {
                            window.location.href = '#form-top';
                            return true;
                        }
                        setUpValidation();
    </script>

</div>

Я что-то здесь не так делаю или JSP_form (Webform) не позволяет отправить?

Любая помощь будет оценена.

Заранее спасибо!