Buenas,
Estoy validando los campos de un formulario con jquery. En la validación no tengo problema, lo que pasa es que que una vez se han validado todos los campos del formulario quiero que aparezca un tipo popup (pero sin saltar otra ventana), como una dialogo modal, en el que se muestre un resumen de los datos introducidos por el usuario en el formulario y aparezca un botón o lo que sea, en esta ventana modal para aceptar o modificar los datos del formulario.
Lo de la ventana modal lo estoy haciendo con un plugin de jquery llamado reveal (
http://zurb.com/playground/reveal-modal-plugin ), y queda bastante bien. El problema que tengo principalmente es que no se como decirle devolver un true o un false, a la función en la que valido el formulario, en función de que se pulse en esta ventana modal modificar o aceptar.
Voy a explicar como funciona reveal y como tengo mi función de validación.
Reveal es sencillo de utilizar, hay que enlazar al html donde se va a utilizar el css y el js de el. Hecho esto se crea por ejemplo un div con un id cualquiera y se estabece la clase "reveal-modal" en el.
<div id="resumen" class="reveal-modal">
<a href="#" id="modificar" style="float:left;">MODIFICAR</a>
<a href="#" id="aceptar" style="float:right;">ACEPTAR</a>
</div>
Ahora simplemente a un enlace a se le añade el atributo, data-reveal-id="resumen", donde se especifica el id del div creado anterior, y al ser pulsado este elemento, aparece la ventana modal. Podría ser algo así.
<a href="#" data-reveal-id="resumen" id="i01">pulsame</a>
Buendo dicho como funciona este plugin voy a entrar en más detalle en donde me estoy encontrando el problema.
Tengo un archivo js, como dije, donde valido el formulario y devuelvo true o false para que el formulario se lance.
Mi formulario:
<form action="envio.php" method="POST" class="contact_form" id="formulario" >
<label >Nombre</label>
<input type="text" id="nombre" name="nombre" placeholder="Nombre">
<input type="submit" value="CONFIRMAR" id="btn" >
</form>
Dentro del mismo html que el formulario tengo lo explicado anteriormente de reveal.
<div id="resumen" class="reveal-modal">
<a href="#" id="modificar" style="float:left;">MODIFICAR</a>
<a href="#" id="aceptar" style="float:right;">ACEPTAR</a>
</div>
<a href="#" data-reveal-id="resumen" style="display:none;" id="i01"></a>
El archivo que valida el formulario es:
$(document).ready(function () {
$("#btn").click(function (){
var band=true;
if( $("#nombre").val() == "" ){
band=false;
$("#nombre").focus();
}
if(band){
//se añade al div de resumen el nombre introducido en el formulario
$("#resumen").append("<p>Nombre: "+$("#nombre").val()+"</p>");
//Simulo un click para que salte la venta modal de reveal
$("#i01").click();
// Aqui es donde tengo el problema... no se como hacer que cuando se pulse el enlace con id "modificar" o "aceptar", me devuelve un true o un false
$("#modificar").click(function(){
band=false;
});
$("#aceptar").click(function(){
band=true;
});
}
//Devuelvo el valor booleano para saber que tiene que hacer el formulario, si enviarse o no
return band;
}
PD: puede haber alguna errata de sintaxis, no se centren en eso, lo que me interesa es el problema logico.
UN saludo.
