I have a ZOHO CRM form integrated in a page which will be used to capture customer leads. Right now it’s in testing mode and making sure that the form is fully functional before implementing it in LIVE Production Site. The issue which I’m facing is that while I’m tyring to submit the form the form Validation should work but instead it keeps failing and the form gets submitted even without the required fields filled. Surprizing News is while I’m submitting this form in an HTML file the validations are working fine I’m not getting any help from Zoho support but doesn’t seems to work in WordPress site. I’m also not gettinmg any help from ZOHO support so It will be huge time saviour for me if somebody can help me out resolving this.
My ZOHO Form Here
Source Code:-
<!-- Note :
- You can modify the font style and form style to suit your website.
- Code lines with comments Do not remove this code are required for the form to work properly, make sure that you do not remove these lines of code.
- The Mandatory check script can modified as to suit your business needs.
- It is important that you test the modified form before going live.-->
<div id='crmWebToEntityForm' class='zcwf_lblLeft crmWebToEntityForm'
style='background-color: white;color: black;max-width: 600px;'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<META HTTP-EQUIV='content-type' CONTENT='text/html;charset=UTF-8'>
<script src='https://www.google.com/recaptcha/api.js' async defer></script>
<form id='webform5841441000086427018' action='https://crm.zoho.com/crm/WebToContactForm'
name=WebToContacts5841441000086427018 method='POST'
onSubmit='javascript:document.charset="UTF-8"; return checkMandatory5841441000086427018()'
accept-charset='UTF-8'>
<input type='text' style='display:none;' name='xnQsjsdp'
value='59d9e3bfe050aa772fa9eff08ab95ee7744a4d3feb47ad80184df6e8c0e0a7f1'></input>
<input type='hidden' name='zc_gad' id='zc_gad' value=''></input>
<input type='text' style='display:none;' name='xmIwtLD'
value='4c631f0ca6a99b1eb4bcb07586b5e53746b2e987361bf5a47626e8deb3f3319350599c5aa4b81b554f0161ad29033838'></input>
<input type='text' style='display:none;' name='actionType' value='Q29udGFjdHM='></input>
<input type='text' style='display:none;' name='returnURL'
value='https://pmcorp.com/thank-you/'> </input>
<!-- Do not remove this code. -->
<style>
html,
body {
margin: 0px;
}
#crmWebToEntityForm.zcwf_lblLeft {
width: 100%;
padding: 25px;
margin: 0 auto;
box-sizing: border-box;
}
#crmWebToEntityForm.zcwf_lblLeft * {
box-sizing: border-box;
}
#crmWebToEntityForm {
text-align: left;
}
#crmWebToEntityForm * {
direction: ltr;
}
.zcwf_lblLeft .zcwf_title {
word-wrap: break-word;
padding: 0px 6px 10px;
font-weight: bold
}
.zcwf_lblLeft.cpT_primaryBtn:hover {
background: linear-gradient(#02acff 0, #006be4 100%) no-repeat padding-box !important;
box-shadow: 0 -2px 0 0 #0159b9 inset !important;
border: 0 !important;
color: #fff !important;
outline: 0 !important;
}
.zcwf_lblLeft .zcwf_col_fld input[type=text],
input[type=password],
.zcwf_lblLeft .zcwf_col_fld textarea {
width: 60%;
border: 1px solid #c0c6cc !important;
resize: vertical;
border-radius: 2px;
float: left;
}
.zcwf_lblLeft .zcwf_col_lab {
width: 30%;
word-break: break-word;
padding: 0px 6px 0px;
margin-right: 10px;
margin-top: 5px;
float: left;
min-height: 1px;
}
.zcwf_lblLeft .zcwf_col_fld {
float: left;
width: 68%;
padding: 0px 6px 0px;
position: relative;
margin-top: 5px;
}
.zcwf_lblLeft .zcwf_privacy {
padding: 6px;
}
.zcwf_lblLeft .wfrm_fld_dpNn {
display: none;
}
.dIB {
display: inline-block;
}
.zcwf_lblLeft .zcwf_col_fld_slt {
width: 60%;
border: 1px solid #ccc;
background: #fff;
border-radius: 4px;
font-size: 12px;
float: left;
resize: vertical;
padding: 2px 5px;
}
.zcwf_lblLeft .zcwf_row:after,
.zcwf_lblLeft .zcwf_col_fld:after {
content: '';
display: table;
clear: both;
}
.zcwf_lblLeft .zcwf_col_help {
float: left;
margin-left: 7px;
font-size: 12px;
max-width: 35%;
word-break: break-word;
}
.zcwf_lblLeft .zcwf_help_icon {
cursor: pointer;
width: 16px;
height: 16px;
display: inline-block;
background: #fff;
border: 1px solid #c0c6cc;
color: #c1c1c1;
text-align: center;
font-size: 11px;
line-height: 16px;
font-weight: bold;
border-radius: 50%;
}
.zcwf_lblLeft .zcwf_row {
margin: 15px 0px;
}
.zcwf_lblLeft .formsubmit {
margin-right: 5px;
cursor: pointer;
color: var(--baseColor);
font-size: 12px;
}
.zcwf_lblLeft .zcwf_privacy_txt {
width: 90%;
color: rgb(0, 0, 0);
font-size: 12px;
font-family: Arial;
display: inline-block;
vertical-align: top;
color: var(--baseColor);
padding-top: 2px;
margin-left: 6px;
}
.zcwf_lblLeft .zcwf_button {
font-size: 12px;
color: var(--baseColor);
border: 1px solid #c0c6cc;
padding: 3px 9px;
border-radius: 4px;
cursor: pointer;
max-width: 120px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.zcwf_lblLeft .zcwf_tooltip_over {
position: relative;
}
.zcwf_lblLeft .zcwf_tooltip_ctn {
position: absolute;
background: #dedede;
padding: 3px 6px;
top: 3px;
border-radius: 4px;
word-break: break-word;
min-width: 100px;
max-width: 150px;
color: var(--baseColor);
z-index: 100;
}
.zcwf_lblLeft .zcwf_ckbox {
float: left;
}
.zcwf_lblLeft .zcwf_file {
width: 55%;
box-sizing: border-box;
float: left;
}
.clearB:after {
content: '';
display: block;
clear: both;
}
@media all and (max-width: 600px) {
.zcwf_lblLeft .zcwf_col_lab,
.zcwf_lblLeft .zcwf_col_fld {
width: auto;
float: none !important;
}
.zcwf_lblLeft .zcwf_col_help {
width: 40%;
}
}
</style>
<div class='zcwf_row'>
<div class='zcwf_col_lab' style='font-size:12px; font-family: Arial;'><label for='Last_Name'>Full Name<span
style='color:red;'>*</span></label></div>
<div class='zcwf_col_fld'><input type='text' id='Last_Name' name='Last Name' maxlength='80'></input>
<div class='zcwf_col_help'></div>
</div>
</div>
<div class='zcwf_row'>
<div class='zcwf_col_lab' style='font-size:12px; font-family: Arial;'><label
for='Account_Name'>Company</label></div>
<div class='zcwf_col_fld'><input type='text' id='Account_Name' name='Account Name' maxlength='100'></input>
<div class='zcwf_col_help'></div>
</div>
</div>
<div class='zcwf_row'>
<div class='zcwf_col_lab' style='font-size:12px; font-family: Arial;'><label for='Email'>Email<span
style='color:red;'>*</span></label></div>
<div class='zcwf_col_fld'><input type='text' ftype='email' autocomplete='false' id='Email' name='Email'
crmlabel='' maxlength='100'></input>
<div class='zcwf_col_help'></div>
</div>
</div>
<div class='zcwf_row'>
<div class='zcwf_col_lab' style='font-size:12px; font-family: Arial;'><label for='Phone'>Phone</label></div>
<div class='zcwf_col_fld'><input type='text' id='Phone' name='Phone' maxlength='50'></input>
<div class='zcwf_col_help'></div>
</div>
</div>
<div class='zcwf_row'>
<div class='zcwf_col_lab' style='font-size:12px; font-family: Arial;'><label for='CONTACTCF169'>Region<span
style='color:red;'>*</span></label></div>
<div class='zcwf_col_fld'><select class='zcwf_col_fld_slt' id='CONTACTCF169' name='CONTACTCF169'>
<option value='-None-'>-None-</option>
<option value='Africa'>Africa</option>
<option value='Australia'>Australia</option>
<option value='Central America'>Central America</option>
<option value='East Asia'>East Asia</option>
<option value='Europe'>Europe</option>
<option value='India'>India</option>
<option value='Middle East'>Middle East</option>
<option value='North America'>North America</option>
<option value='South America'>South America</option>
</select>
<div class='zcwf_col_help'></div>
</div>
</div>
<div class='zcwf_row'>
<div class='zcwf_col_lab' style='font-size:12px; font-family: Arial;'><label for='Lead_Source'>How did you
find out about us?<span style='color:red;'>*</span></label></div>
<div class='zcwf_col_fld'><select class='zcwf_col_fld_slt' id='Lead_Source' name='Lead Source'>
<option value='-None-'>-None-</option>
<option value='Advertisement'>Advertisement</option>
<option value='Chat'>Chat</option>
<option value='Cold Call'>Cold Call</option>
<option value='Employee Referral'>Employee Referral</option>
<option value='External Referral'>External Referral</option>
<option value='Facebook'>Facebook</option>
<option value='Google AdWords'>Google AdWords</option>
<option value='Google+'>Google+</option>
<option value='Internal Seminar'>Internal Seminar</option>
<option value='Online Store'>Online Store</option>
<option value='Partner'>Partner</option>
<option value='PMC Webinar'>PMC Webinar</option>
<option value='PMC Website'>PMC Website</option>
<option value='Public Relations'>Public Relations</option>
<option value='Sales Email Alias'>Sales Email Alias</option>
<option value='Seminar Partner'>Seminar Partner</option>
<option value='Trade Show'>Trade Show</option>
<option value='Twitter'>Twitter</option>
<option value='Web Cases'>Web Cases</option>
<option value='Web Download'>Web Download</option>
<option value='Web Mail'>Web Mail</option>
<option value='Web Research'>Web Research</option>
<option value='Webform on PMC-affiliated website'>Webform on PMC-affiliated website
</option>
</select>
<div class='zcwf_col_help'></div>
</div>
</div>
<div class='zcwf_row'>
<div class='zcwf_col_lab' style='font-size:12px; font-family: Arial;'><label for='CONTACTCF168'>Anything you
would like to add<span style='color:red;'>*</span></label></div>
<div class='zcwf_col_fld'><input type='text' id='CONTACTCF168' name='CONTACTCF168' maxlength='255'></input>
<div class='zcwf_col_help'></div>
</div>
</div>
<div class='zcwf_row'>
<div class='zcwf_col_lab' style='font-size:12px; font-family: Arial;'><label for='CONTACTCF166'>Which
services are you interested in?<span style='color:red;'>*</span></label></div>
<div class='zcwf_col_fld'><select class='zcwf_col_fld_slt' id='CONTACTCF166' name='CONTACTCF166' multiple>
<option value='AEC'>AEC</option>
<option value='AEC CAD/BIM'>AEC CAD/BIM</option>
<option value='Autodesk'>Autodesk</option>
<option value='Autodesk & Mfg Software'>Autodesk & Mfg Software</option>
<option value='Industrial & Mfg Eng'>Industrial & Mfg Eng</option>
<option value='Industrial CAD/BIM'>Industrial CAD/BIM</option>
<option value='Industrial Engineering Services'>Industrial Engineering Services</option>
<option value='Information Technology'>Information Technology</option>
<option value='Laser Scanning'>Laser Scanning</option>
<option value='Mfg Software'>Mfg Software</option>
<option value='Part Scan/Reverse Eng'>Part Scan/Reverse Eng</option>
<option value='Quality/Compliance'>Quality/Compliance</option>
<option value='Scheduling'>Scheduling</option>
<option value='Simulation'>Simulation</option>
<option value='Staffing'>Staffing</option>
<option value='Staffing Solutions'>Staffing Solutions</option>
<option value='Steel Detailing'>Steel Detailing</option>
<option value='Supply Chain Eng'>Supply Chain Eng</option>
</select>
<div class='zcwf_col_help'></div>
</div>
</div>
<div class='zcwf_row wfrm_fld_dpNn'>
<div class='zcwf_col_lab' style='font-size:12px; font-family: Arial;'><label for='CONTACTCF15'>Lead
Qualified</label></div>
<div class='zcwf_col_fld'><select class='zcwf_col_fld_slt' id='CONTACTCF15' name='CONTACTCF15'>
<option value='-None-'>-None-</option>
<option selected value='MQL'>MQL</option>
<option value='SQL'>SQL</option>
</select>
<div class='zcwf_col_help'></div>
</div>
</div>
<div class='zcwf_row'>
<div class='zcwf_col_lab'></div>
<div class='zcwf_col_fld'>
<div class='g-recaptcha' data-sitekey='6LcgxagpAAAAAMpNF3haXFEM_qf-ZdptiTLUhGI6' data-theme='light'
data-callback='rccallback5841441000086427018' captcha-verified='false'
id='recap5841441000086427018'></div>
<div id='recapErr5841441000086427018' style='font-size:12px;color:red;visibility:hidden;'>Captcha
validation failed. If you are not a robot then please try again.</div>
</div>
</div>
<div class='zcwf_row'>
<div class='zcwf_col_lab'></div>
<div class='zcwf_col_fld'><input type='submit' id='formsubmit' class='formsubmit zcwf_button' value='Submit'
title='Submit'><input type='reset' class='zcwf_button' name='reset' value='Reset' title='Reset'>
</div>
</div>
<script>
/* Do not remove this code. */
function rccallback5841441000086427018() {
if (document.getElementById('recap5841441000086427018') != undefined) {
document.getElementById('recap5841441000086427018').setAttribute('captcha-verified', true);
}
if (document.getElementById('recapErr5841441000086427018') != undefined && document.getElementById('recapErr5841441000086427018').style.visibility == 'visible') {
document.getElementById('recapErr5841441000086427018').style.visibility = 'hidden';
}
}
function reCaptchaAlert5841441000086427018() {
var recap = document.getElementById('recap5841441000086427018');
if (recap != undefined && recap.getAttribute('captcha-verified') == 'false') {
document.getElementById('recapErr5841441000086427018').style.visibility = 'visible';
return false;
}
return true;
}
function validateEmail5841441000086427018() {
var form = document.forms['WebToContacts5841441000086427018'];
var emailFld = form.querySelectorAll('[ftype=email]');
var i;
for (i = 0; i < emailFld.length; i++) {
var emailVal = emailFld[i].value;
if ((emailVal.replace(/^s+|s+$/g, '')).length != 0) {
var atpos = emailVal.indexOf('@');
var dotpos = emailVal.lastIndexOf('.');
if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= emailVal.length) {
alert('Please enter a valid email address. ');
emailFld[i].focus();
return false;
}
}
}
return true;
}
function checkMandatory5841441000086427018() {
var mndFileds = new Array('Lead Source', 'Last Name', 'Email', 'CONTACTCF166', 'CONTACTCF168', 'CONTACTCF169');
var fldLangVal = new Array('Howx20didx20youx20findx20outx20aboutx20usx3F', 'Fullx20Name', 'Email', 'Whichx20servicesx20arex20youx20interestedx20inx3F', 'Anythingx20youx20wouldx20likex20tox20add', 'Region');
for (i = 0; i < mndFileds.length; i++) {
var fieldObj = document.forms['WebToContacts5841441000086427018'][mndFileds[i]];
if (fieldObj) {
if (((fieldObj.value).replace(/^s+|s+$/g, '')).length == 0) {
if (fieldObj.type == 'file') {
alert('Please select a file to upload.');
fieldObj.focus();
return false;
}
alert(fldLangVal[i] + ' cannot be empty.');
fieldObj.focus();
return false;
} else if (fieldObj.nodeName == 'SELECT') {
if (fieldObj.options[fieldObj.selectedIndex].value == '-None-') {
alert(fldLangVal[i] + ' cannot be none.');
fieldObj.focus();
return false;
}
} else if (fieldObj.type == 'checkbox') {
if (fieldObj.checked == false) {
alert('Please accept ' + fldLangVal[i]);
fieldObj.focus();
return false;
}
}
try {
if (fieldObj.name == 'Last Name') {
name = fieldObj.value;
}
} catch (e) { }
}
}
if (!validateEmail5841441000086427018()) { return false; }
if (!reCaptchaAlert5841441000086427018()) { return false; }
var urlparams = new URLSearchParams(window.location.search);
if (urlparams.has('service') && (urlparams.get('service') === 'smarturl')) {
var webform = document.getElementById('webform5841441000086427018');
var service = urlparams.get('service');
var smarturlfield = document.createElement('input');
smarturlfield.setAttribute('type', 'hidden');
smarturlfield.setAttribute('value', service);
smarturlfield.setAttribute('name', 'service');
webform.appendChild(smarturlfield);
}
document.querySelector('.crmWebToEntityForm .formsubmit').setAttribute('disabled', true);
}
function tooltipShow5841441000086427018(el) {
var tooltip = el.nextElementSibling;
var tooltipDisplay = tooltip.style.display;
if (tooltipDisplay == 'none') {
var allTooltip = document.getElementsByClassName('zcwf_tooltip_over');
for (i = 0; i < allTooltip.length; i++) {
allTooltip[i].style.display = 'none';
}
tooltip.style.display = 'block';
} else {
tooltip.style.display = 'none';
}
}
</script>
<!-- Do not remove this --- Analytics Tracking code starts -->
<script id='wf_anal'
src='https://crm.zohopublic.com/crm/WebFormAnalyticsServeServlet?rid=937d78df36560dbec5f0d1e626ee06abe574434be6d4ffe4cf003dc024b87303f9dd213fe45c3c8216a9c99109b0f2f3gidc90fc9f5a80b6621350e904be2d896509d547aa2d3a833c60e9e50e5304b4f9cgid1fb196c62f6e5ca79c23530f2d72c512009237e64cc174671f430a6792542c42gidc032fe53674d813210db6fe2f667d4400ec9a08ad010c3a3c782caaf200d53f9&tw=e9ac4ca3618af58d8124a4bfd78d3d6f40ed9c45accadb9f08cff76782d1d051'></script>
<!-- Do not remove this --- Analytics Tracking code ends. -->
</form>
</div>
I tried creating different forms but every time the validation present in HTML form file works and the validation fails everytime whenever I apply it in WordPress.
Joy is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.