Hola a todos.
Tengo un formulario que funciona perfectamente, aparecen los mensajes de error si no se introducen datos y se envían los datos correctamente.
El problema está en que justo después de enviar los datos, mediante el botón submit correspondiente, la caja que contiene los campos del formulario desaparece, y el formulario deja de estar visible.
He buscado en el css y no hay ninguna línea que haga desaparecer el formulario, por lo que no sé si puede ser problema del código jquery que utilizo para la validación y envío de datos.
Este es el código:
Código:
jQuery(document).ready(function($){
// hide messages
$("#error").hide();
$("#sent-form-msg").hide();
// on submit...
$("#contactForm #submit").click(function() {
$("#error").hide();
//required:
//name
var name = $("input#name").val();
if(name.trim() == ""){
$("#error").fadeIn().text("Por favor introduce tu nombre");
$("input#name").focus();
return false;
}
//formato email
var email = $("input#email").val();
var regex = /[\w-\.]{2,}@([\w-]{2,}\.)*([\w-]{2,}\.)[\w-]{2,4}/;
if (!regex.test($("#email").val().trim())) {
$("#error").fadeIn().text("Email no introducido o incorrecto");
$("input#email").focus();
return false;
}
// asunto
var asunto = $("input#asunto").val();
if(asunto.trim() == ""){
$("#error").fadeIn().text("Por favor introduce el asunto de tu mensaje");
$("input#asunto").focus();
return false;
}
// comments
var comments = $("#comments").val();
if(comments == ""){
$("#error").fadeIn().text("Por favor introduce un mensaje");
$("#comments").focus();
return false;
}
//condiciones
if (!document.getElementById('chkAcepto').checked) {
$("#error").fadeIn().text("Por favor acepta los términos y condiciones");
document.getElementById('chkAcepto').focus();
return false;
}
// send mail php
var sendMailUrl = $("#sendMailUrl").val();
//to, from & subject
var to = $("#to").val();
var from = $("#from").val();
var subject = $("#subject").val();
// data string
var dataString = 'name=' + name
+ '&email=' + email
+ '&asunto=' + asunto
+ '&comments=' + comments
+ '&to=' + to
+ '&from=' + from
+ '&subject=' + subject;
// ajax
$.ajax({
type:"POST",
url: sendMailUrl,
data: dataString,
success: success()
});
});
// on success...
function success(){
$("#sent-form-msg").fadeIn();
$("#contactForm").fadeOut();
}
return false;
});
Al visualizar el código html una vez que ha sido enviado el formulario veo que a la caja que contiene todos los campos se le asigna un "style: display=none", que es el culpable de que desaparezca. El problema es que no sé que está provocando la asignación de este estilo.