Required fields not working on non-marketo page form

[Anonymous]

Hello everyone, I have a form on a non-marketo page that has designated required fields, but the form is not stopping users from submitting if a required field is not filled out and is leading to lead data being blocked from salesforce.

The required field javascript appears to be intact on the page, and I have searched for this issue in the support community but have not found a solution. Can anyone see a problem with the code below? Many thanks!

<!-- SYSTEM JAVASCRIPT - DO NOT EDIT -->

<script type="text/javascript">

function fieldValidate(field) {

  /* call Mkto.setError(field, message) and return false to mark a field value invalid */

  /* return 'skip' to bypass the built-in validations */

  return true;

}

function getRequiredFieldMessage(domElement, label) {

  return "This field is required";

}

function getTelephoneInvalidMessage(domElement, label) {

  return "Please enter a valid telephone number";

}

function getEmailInvalidMessage(domElement, label) {

  return "Please enter a valid email address";

}

</script>

<form class="lpeRegForm formNotEmpty" method="post" enctype="application/x-www-form-urlencoded" action="http://pages.c.seamless.com/index.php/leadCapture/save" id="mktForm_1013" name="mktForm_1013"><ul class='mktLblLeft'>

<div class='row'>

<div class='one-third column alpha'>

<li  class='mktFormReq mktField' ><label>First Name:<br>

</label><span class='mktInput'><input class='mktFormText mktFormString mktFReq' name="FirstName" id="FirstName" type='text' value=""  maxlength='255' tabIndex='1' size='38' /><span class='mktFormMsg'></span></span></li>

</div>

<div class='row'>

<div class='one-third column omega'>

<li  class='mktFormReq mktField' ><label>Last Name:<br>

</label><span class='mktInput'><input class='mktFormText mktFormString mktFReq' name="LastName" id="LastName" type='text' value=""  maxlength='255' tabIndex='2' size='38' /><span class='mktFormMsg'></span></span></li>

</div>

<div class='row'>

<div class='one-third column alpha'>

<li  class='mktFormReq mktField' ><label>Email Address:<br>

</label><span class='mktInput'><input class='mktFormText mktFormEmail mktFReq' name="Email" id="Email" type='text' value=""  maxlength='255' tabIndex='3' size='38'/><span class='mktFormMsg'></span></span></li>

</div>

<div class='row'>

<div class='one-third column omega'>

<li  class='mktFormReq mktField' ><label>Company:<br>

</label><span class='mktInput'><input class='mktFormText mktFormString mktFReq' name="Company" id="Company" type='text' value=""  maxlength='255' tabIndex='4' size='38'/><span class='mktFormMsg'></span></span></li>

</div>

<div class='row'>

<div class='one-third column alpha'>

<li  class='mktFormReq mktField' ><label>Job Title:<br>

</label><span class='mktInput'><input class='mktFormText mktFormString mktFReq' name="Title" id="Title" type='text' value=""  maxlength='255' tabIndex='5' size='38'/><span class='mktFormMsg'></span></span></li>

</div>

<div class='row'>

<div class='one-third column omega'>

<li  class='mktFormReq mktField' ><label>Zip Code:<br>

</label><span class='mktInput'><input class='mktFormText mktFormString mktFReq' name="PostalCode" id="PostalCode" type='text' value=""  maxlength='255' tabIndex='6' size='38'/><span class='mktFormMsg'></span></span></li>

</div>

<div class='row'>

<div class='one-third column alpha'>

<li  class='mktFormReq mktField' ><label>Phone Number:<br>

</label><span class='mktInput'><input class='mktFormText mktFormPhone mktFReq' name="Phone" id="Phone" type='text' value=""  maxlength='255' tabIndex='7' size='38'/><span class='mktFormMsg'></span></span></li>

</div>

<div class='row'>

<div class='one-third column omega'>

<li  class='mktFormReq mktField' ><label>Number of Office Employees:<br>

</label><span class='mktInput'><input class='mktFormText mktFormInt mktFReq' name="NumberOfEmployees" id="NumberOfEmployees" type='text' value=""  maxlength='225' tabIndex='8' size='38' /><span class='mktFormMsg'></span></span></li>

</div>

<li  class='mktFormReq mktField' style="display: none;"><label>Lead Source:</label><span class='mktInput'><input class='mktFormHidden' name="LeadSource" id="LeadSource" type='hidden' value="Inbound" /><span class='mktFormMsg'></span></span></li>

<li  class='mktFormReq mktField' style="display: none;" ><label>Lead Source Subtype:</label><span class='mktInput'><select class='mktFormSelect mktFReq' name="Lead_Source_Subtype__c" id="Lead_Source_Subtype__c" size='1'   tabIndex='10'><option value='Get Started Form' selected='selected'>Get Started Form</option></select><span class='mktFormMsg'></span></span></li>

<li  class='mktField' style="display: none;"><label>Lead Source - most recent:</label><span class='mktInput'><input class='mktFormHidden' name="Lead_Source_most_recent__c" id="Lead_Source_most_recent__c" type='hidden' value="Inbound" /><span class='mktFormMsg'></span></span></li>

<li  class='mktField' style="display: none;"><label>Lead Source Subtype - most recent:</label><span class='mktInput'><input class='mktFormHidden' name="Lead_Source_Subtype_most_recent__c" id="Lead_Source_Subtype_most_recent__c" type='hidden' value="Get Started Form" /><span class='mktFormMsg'></span></span></li>

<li  class='mktField' style="display: none;"><label>IR Customer ID:</label><span class='mktInput'><input class='mktFormHidden' name="IR_Customer_ID__c" id="IR_Customer_ID__c" type='hidden' value="" /><span class='mktFormMsg'></span></span></li>

<li  class='mktField' style="display: none;"><label>IR Order ID:</label><span class='mktInput'><input class='mktFormHidden' name="IR_Order_ID__c" id="IR_Order_ID__c" type='hidden' value="" /><span class='mktFormMsg'></span></span></li>

<li id='mktFrmButtons'>

  <input class='button1' id='mktFrmSubmit' type='submit' style="overflow: visible;" value='Submit' name='submitButton' onclick='formSubmit(document.getElementById("mktForm_1013")); return false;' />&nbsp;<input style='display: none;' id='mktFrmReset' type='reset'

              value='' name='resetButton' onclick='formReset(document.getElementById("mktForm_1013")); return false;' /></li>  </ul>

  <span style="display:none;"><input type="text" name="_marketo_comments" value="" /></span>

  <input type="hidden" name="lpId" value="-1" />

  <input type="hidden" name="subId" value="55" />

  <input type="hidden" name="munchkinId" value="380-VMG-788" />

  <input type="hidden" name="kw" value="" />

  <input type="hidden" name="cr" value="" />

  <input type="hidden" name="searchstr" value="" />

  <input type="hidden" name="lpurl" value="http://pages.c.seamless.com/GetStarted.html?cr={creative}&kw={keyword}" />

  <input type="hidden" name="formid" value="1013" />

  <input type="hidden" name="returnURL" value="www.seamless.com/business/thanks" />

  <input type="hidden" name="retURL" value="www.seamless.com/business/thanks" />

  <input type="hidden" name="returnLPId" value="-1" />

  <input type="hidden" name="_mkt_disp" value="return" />

      <input type="hidden" name="_mkt_trk" value="" />

  </form>

<script type="text/javascript" src="http://pages.c.seamless.com/js/mktFormSupport.js"></script>

<script type="text/javascript">

function formSubmit(elt) {

  return Mkto.formSubmit(elt);

}

function formReset(elt) {

  return Mkto.formReset(elt);

}

</script>

[Anonymous]

I'm not 100% sure, but there may be some other bit of Javascript/jQuery on the page that is conflicting with the form validation jQuery and is causing this issue.

[Anonymous]

Thank you for your help Kenny, that is very strange that the form works properly for you, we are experiencing the error message, but the form still submits and moves to the thank you page.

I've submitted a support case to try and look further into it, thanks again!

[Anonymous]

You only need to have that script once.  I would keep it at the bottom, below the form HTML.

I tested the HTML in your original post, and it is working correctly for me.  The form is not submitting unless each field is filled out correctly.

[Anonymous]

Thank you! Does it matter where I have this on the page? I do already have this code after the form code but it still hasn't been working.

[Anonymous]

You need to add this to the end of your code:

<script type="text/javascript" src="http://pages.c.seamless.com/js/mktFormSupport.js"></script>

<script type="text/javascript">

function formSubmit(elt) {

  return Mkto.formSubmit(elt);

}

function formReset(elt) {

  return Mkto.formReset(elt);

}

</script>