I have a problem since yesterday with the following form with submit button
<form id="form_contactanos" action='https://crm.zoho.com/crm/WebToLeadForm' name=WebToLeads54017000020400005 method='POST' onSubmit='javascript:document.charset="UTF-8"; return checkMandatory54017000020400005(event)' accept-charset='UTF-8'>
<div class="row">
<!-- Do not remove this code. -->
<input type='text' style='display:none;' name='xnQsjsdp' value='b8c6293891e2878f125a78c114c45d1133cd8ab0fd31519fb0e76a930012c594'/>
<input type='hidden' name='zc_gad' id='zc_gad' value=''/>
<input type='text' style='display:none;' name='xmIwtLD' value='8a7419917526917cd8f7bdba23036d4e91d640f798fb7dcac4168b987edf63b4'/>
<input type='text' style='display:none;' name='actionType' value='TGVhZHM='/>
<input type='text' style='display:none;' name='returnURL' value='https://syntaxtecnologias.com.mx/index.php/Inicio_controller/contactanos' />
<!-- Do not remove this code. -->
<style>
tr , td {
padding:6px;
border-spacing:0px;
border-width:0px;
}
</style>
<table style='width:600px;background-color:white;color:black'>
<h1 class="title font-light m-t-10">Contáctanos</h1>
<div class="col-lg-12">
<div class="form-group m-t-10">
<input id="txt_nombre" name="First Name" class="form-control" type="text" placeholder="Nombre(s)"> </div>
</div>
<div class="col-lg-12">
<div class="form-group m-t-10">
<input id="txt_apellido" name="Last Name" class="form-control" type="text" placeholder="Apellidos"> </div>
</div>
<div class="col-lg-12">
<div class="form-group m-t-10">
<input id="txt_puesto" name="LEADCF31" class="form-control" type="text" placeholder="Tu Puesto"> </div>
</div>
<div class="col-lg-12">
<div class="form-group">
<label>Giro de la Empresa</label>
<select class="custom-select col-12" name='Industry'>
<option value='-None-'>---Seleccione---</option>
<option value='ASP'>ASP</option>
<option value='Comercio Electrónico'>Comercio Electrónico</option>
<option value='Comercio Exterior'>Comercio Exterior</option>
<option value='Corporativo/Grande'>Corporativo/Grande</option>
<option value='Educacion/Capacitacion'>Educacion/Capacitacion</option>
<option value='Embajadas y Consulados'>Embajadas y Consulados</option>
<option value='Empresas de Servicios'>Empresas de Servicios</option>
<option value='Gobierno/Militar'>Gobierno/Militar</option>
<option value='Industria Aeronáutica'>Industria Aeronáutica</option>
<option value='Industria Automotriz'>Industria Automotriz</option>
<option value='Industria de Alimentos'>Industria de Alimentos</option>
<option value='Industria de la Construcción'>Industria de la Construcción</option>
<option value='Industria de las Telecomunicaciones'>Industria de las Telecomunicaciones</option>
<option value='Industria Energética'>Industria Energética</option>
<option value='Industria Hotelera'>Industria Hotelera</option>
<option value='Industria Inmobiliaria'>Industria Inmobiliaria</option>
<option value='Industria Manufactura'>Industria Manufactura</option>
<option value='Industria Maquiladora'>Industria Maquiladora</option>
<option value='Industria Metalmecanica'>Industria Metalmecanica</option>
<option value='Industria Minera'>Industria Minera</option>
<option value='Industria Química'>Industria Química</option>
<option value='Industria Textil'>Industria Textil</option>
<option value='Industria Turística'>Industria Turística</option>
<option value='Inmobiliaria'>Inmobiliaria</option>
<option value='ISP ( Intenet Service Provider)'>ISP ( Intenet Service Provider)</option>
<option value='Proyectos de Infraestructura'>Proyectos de Infraestructura</option>
<option value='PyME/Mediana Empresa'>PyME/Mediana Empresa</option>
<option value='Salud'>Salud</option>
<option value='Sector Financiero y Bancos'>Sector Financiero y Bancos</option>
<option value='Servicios Financieros, inmobiliarios y de Alquiler'>Servicios Financieros, inmobiliarios y de Alquiler</option>
<option value='Servicios Tecnicos Profesionales, Personales y Soc'>Servicios Tecnicos Profesionales, Personales y Soc</option>
<option value='SoHo/Micro Empresa'>SoHo/Micro Empresa</option>
<option value='Transportes y Comunicaciones'>Transportes y Comunicaciones</option>
</select>
</td>
</div>
</div>
<div class="col-lg-12">
<div class="form-group m-t-10">
<input id="txt_ubicacion" name="Street" class="form-control" type="text" placeholder="Ubicación"> </div>
</div>
<div class="col-lg-12">
<div class="form-group m-t-10">
<input id="txt_telefono" name="Phone" class="form-control" type="text" placeholder="Teléfono"> </div>
</div>
<div class="col-lg-12">
<div class="form-group m-t-10">
<textarea id="txt_mensaje" name="LEADCF30" class="form-control" rows="3" placeholder="Mensaje"></textarea>
</div>
</div>
<div class="col-lg-12">
<div id="recaptcha" class="g-recaptcha" data-sitekey="6LctHHEUAAAAAP99bIMWKIoyMLzEaFnsz0XF2Tpx"></div>
</div>
<div class="col-lg-12">
<button type="submit" class="btn btn-info-gradiant btn-md m-t-20 btn-arrow"><span> ENVIAR <i class="ti-arrow-right"></i></span></button>
</div>
</table>
</div>
</form>
The form calls a JavaScript function checkMandatory54017000020400005 (event) and passes it as an event parameter
<script>
var mndFileds=new Array('First Name','Last Name','Phone');
var fldLangVal=new Array('Nombre','Apellido','Phone');
var name='';
var email='';
function checkMandatory54017000020400005(e) {
e.preventDefault();//detengo el formulario
var $captcha = $( '#recaptcha' ),
response = grecaptcha.getResponse();
if (response.length === 0) {
swal("Algo salió mal!", "Valida el reCAPTCHA por favor!", "error");
} else {
$.ajax({
url : "<?php echo base_url('index.php/Inicio_controller/enviar_mensaje');?>",
type: "POST",
data: $('#form_contactanos').serialize(),
dataType: "JSON",
success: function(data)
{
//checkMandatory54017000020400005();
// console.log(data);
// grecaptcha.reset();
// document.getElementById("form_contactanos").reset();
swal("Buen trabajo!", "Tu mensaje ha sido enviado!", "success");
for(i=0;i<mndFileds.length;i++) {
alert('entra');
var fieldObj=document.forms['WebToLeads54017000020400005'][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) {}
}
}
},
error: function (jqXHR, textStatus, errorThrown)
{
console.log(errorThrown);
swal("Algo salió mal!", "Error al enviar tu mensaje!", "error");
}
});
}
return false;//segun con esto se reanuda enviar el formulario al CRM
}
</script>
I've been doing modifications to the code for example I put recapcha, but before I put the function checkMandatory54017000020400005 (event) did not have the event and neither validated the recap nor the ajax called the controller, at the end of accounts that form was sent to a CRM correctly, but now I want to send it to the mail as well and that is what that call does to the controller by AJAX, the controller works if I do things separately but now I want to put everything together. What I tried to do was send him to the JavaScript function as parameter the event and I stop the form before it is sent and first sent to the mail which if it works, then I try to resume send the form to the CRM but it does not arrive, I suspect that the problem is in the resumption of sending the form to the CRM since it is not arriving the form and to part when if it is sent to the CRM the page is refreshed.
I hope you can support me.