I am trying to submit the hidden form from the Marketo, with the form values from another form (webform) loaded via JSP.
The script is working fine when for a normal HTML form. It's not working with the JSP form. I need some help to troubleshoot the code.
<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&lang=de_DE&_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="{"type":"finish"}" 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>
Am I doing something wrong here or does the JSP_form (Webform) not allowing to submit?
Any help will be appreciated.
Thanks in advance!
This is obvs. not a Marketo issue but one with your JSP forms library.
You have to provide a link to your URL if you want help with this -- the source code pasted here won't make help as there are other components involved.