0

tengo esto maquetado:

Modal

<div class="modal fade" id="message" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title" id="tituloModal" style="font-weight: bold">Recuperar contraseña</h4>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">×</span>
        </button>
      </div>
      <div class="modal-body">
        <p>Se ha enviado un correo electrónico a su dirección de e-mail :)</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
      </div>
    </div>
  </div>
</div>

Campos

<div class="login-box-body">
  <p class="login-box-msg">Ingrese su correo electrónico</p>
  <form method="POST" id="mi_form">
    <div class="form-group has-feedback">
      <input type="email" class="form-control" placeholder="E-mail">
      <span class="glyphicon glyphicon-envelope form-control-feedback"></span>
    </div>
    <div class="row">      
      <div class="col-xs-12">
        <button type="submit" name="recuperar" id="recuperar" class="btn btn-primary btn-block btn-flat" data-toggle="modal" data-target="#message">Enviar</button>
      </div>
    </div>
  </form>
</div>

Y este script JQuery:

Script JQuery

<script type="text/javascript">
  //Muestra el modal 
  $('#recuperar').on('click', function(ev){
   $('#message').show();
 });
  //Re-direcciona cuando se cierra el modal de bootstrap
  $('#message').on('hidden.bs.modal', function(ev) {
    $('form').submit();
    window.location.href = './dame-codigo-de-recuperacion.php';
  })

</script>

El problema es que me interpreta el código JQuery siempre y cuando no ponga un "@" en el campo tipo mail (y cuando no pongo un arroba, salta la comproboación y luego el modal, algo medio feo). La idea sería que, un usuario ingrese su dirección de correo electrónico (compruebo luego si existe en el sistema), se muestre un modal informandole que se enviará un e-mail a su correo electrónico, cuando 'dismisee' el modal lo re-direccione automáticamente a la página 'dame-codigo-de-recuperacion.php' donde insertará el código que le llegó al correo y podrá volver a acceder a su cuenta.

Nota: Ya he visto que hay algunos plugins muy lindos/versátiles para alertas con confirmación en JQuery, pero no creo necesitarlos mucho (solo para estas dos páginas ['me-acabo-de-olvidar-mi-contraseña.php' y 'dame-codigo-de-recuperacion.php']).

¿Alguna ayuda/sugerencia/corrección(es)? Desde ya, muchas gracias :).

1 respuesta 1

1

Bueno, después de mucho, no sé si sea la forma correcta pero lo pude solucionar con un "preventDefault()" en el evento click del botón. Mientras, espero respuestas y si es correcta, espero que le sirva a alguien más :).

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.