Hola a todos, no consigo que esta función se ejecute correctamente. Al hacer clic en el submit del form se activa esta función, pero sólo me muestra los 2 primeros alert y después se recarga sola la página. Cuando vuelvo a hacer clic en el submit del form con la página ya recargada, se muestran los demás alert (empezando por el tercero) y ya se termina de ejecutar la función correctamente. ¿Alguna idea?
Es la primera vez que me pasa que una función se me queda a medio ejecutar y se recarga la página, y luego vuelvo a hacer clic para ejecutarla y sigue por donde se había quedado.
En conclusión: tengo que hacer 2 clics en lugar de 1 para que la función se ejecute.
¿Alguna idea? Gracias.
Código Javascript
:
Ver original<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
alert("entra en el script");
$(function()
{
alert("entra en la funcion jquery");
$(".submit").click(function()
{
alert("entra en la funcion del clic del submit");
var nombre = $("#nombre").val();
var fecha = $("#fecha").val();
var dataString = 'nombre='+ nombre + '&fecha=' + fecha;
alert("variables guardadas");
if(nombre=='' || fecha=='')
{
alert("entra en el if");
$('.success').fadeOut(200).hide();
$('.error').fadeOut(200).show();
}
else
{
alert("entra en el else");
$.ajax({
type: "POST",
url: "join.php",
data: dataString,
success: function()
{
alert("entra en el success");
$('.success').fadeIn(200).show();
$('.error').fadeOut(200).hide();
refresca();
}
});
}
return false;
});
});
Código HTML:
<form method="post" name="form">
<ul>
<li>
Nombre <input id="nombre" name="nombre" type="text" />
</li>
<li>
Fecha <input id="fecha" name="fecha" type="date" />
</li>
</ul>
<div >
<input type="submit" value="Submit" class="submit"/>
<span class="error" style="display:none"> Please Enter Valid Data</span>
<span class="success" style="display:none"> Registration Successfully</span>
</div>
</form>