JQuery - Detener submit

Señores, que tal, tengo la siguiente inquietud. Deseo que al momento de existir algún error de validación, el evento clic de un botón submit se detenga y en caso contrario, avance. A continuación, mi código:


Por más que he buscado y agregado métodos al evento, la página se actualiza de todas formas. ¿Cómo debería hacerlo en este caso?.

Muchas gracias.

Hola amigo, creo que la solucion es muy simple, dado que estas inyectando el evento click al boton, deberias cambiar el tipo del boton de submit a button, eso evitaria que haga el submit, y tu codigo solo lo tendrias que modificar un poco para que haga el submit cuando la validacion este bien

Saludos!

Hola, gracias por responder, es una de las alternativas que había barajado, pero me pidieron que fuera submit. De todas formas había intentado antes con el formulario, algo así:


Y así he experimentado de muchas formas y nada, así es que a ver si puedo convencer para cambiar el tipo de botón y sino, a seguir luchando.

Muchas gracias.

Intenta algo como esto, lo he probado y me funciona muy bien


Adaptala a tu caso y prueba

Hola, gracias nuevamente por tu respuesta. Quizás se me olvidó comentar algo, si se dan cuenta, dentro del jQuery no estoy haciendo ninguna validación, sino que la validación va a un controlador de laravel, entonces si la respuesta desde allá me manda error de validación o de guardado, claro, me manda el mensaje y todo y si todo es correcto guarda la data en base de datos.

Lo anterior quiere decir que si lo realizo de esa forma, al estar bien todo, primero va a guardar por medio del controlador y luego de eso, en vez de retornar a la página donde aparece el listado (típico crud), realizará nuevamente un submit donde ya lógicamente mostrará el mensaje de error traídos por json.

Por eso es que estaba preguntando cómo hacerlo para que en caso de error se detenga en caso de éxito pase de largo.

No se si se entendió claro, sino, me avisan para más detalles.

Buenas de nuevo:

Es decir que llamas dos veces al servidor: una con ajax y la otra de modo normal.

Pues primero que nada el codigo que te pase mas abajo te sigue valiendo. De entrada tendras que cancelar que se envie la pagina si o si. Luego si segun tu codigo confirmas que esta bien o esta mal puedes llamar directamente al boton o al submit:

o

Saludos.

Hola, gracias nuevamente por responder, comento un poco sobre el asunto. Las validaciones se encuentran en un controlador, el flujo sería el siguiente, sí o sí debo llegar al controlador que guarda la data en la base de datos en primer lugar, pues no existe un método de validación separado de esta parte del negocio.

Mediante ajax debo llegar al método del controlador anteriormente señalado, pues me da la respuesta de success o error, si es success, anteriormente ya guardó los datos en la base de datos, entonces que quiere decir esto, que al empezar con las validaciones en jQuery, la respuesta de error o success ya vienen dadas desde el controlador. En caso de ser error, no hay ningún problema, el problema surge cuando es success, pues si recibo eso en la variable data, quiere decir que pasó la validación en el servidor y por ende, ya guardó en la database, por esto es que digo que no puedo ir dos veces al método, pues si voy por segunda vez, ya van los campos en blanco.

Para que se entienda mejor, pondré acá el método al que estoy llamando.

public function store() {
if (Input::get()) {
$inputs = $this->getInputs(Input::all());
if ($this->validateForms($inputs) === TRUE) {
$mensaje = array();
$inputs['detalle_servicio'] = ucwords(trim($inputs['servicio']));
$inputs['session_id'] = $_SESSION['DATA_USER'][0]->ID;
$inputs['updated_at'] = date('Y-m-d H:i:s');
$inputs['created_at'] = date('Y-m-d H:i:s');
$servicio = new Servicio($inputs);
if ($servicio->save()) {//Si esto es true, entonces aquí guarda en la database
$mensaje = "Servicio ingresado correctamente.";
return Response::json(array('success' => TRUE, 'mensaje' => $mensaje));
//return Redirect::to('casinos/servicios')->with(array('mensaje' => $mensaje));
} else {
$mensaje[] = "Error al ingresar el Servicio. Por favor, intente nuevamente.";
return Response::json(array('success' => FALSE, 'mensaje' => $mensaje));
}
} else {
return Response::json(array('success' => FALSE, 'mensaje' => $this->validateForms($inputs)->getMessageBag()->toArray()));
}
} else {
return Redirect::to('casinos/servicios');
}
}

Y bueno, lógicamente el action del formulario está apuntando al método anterior.

Saludos y gracias.

Buenas:

Prueba con:

e.preventDefault(); o return false.

Usa al principio la primera opcion, pero no dentro de la function success.



Saludos.

Estimado, gracias por responder. En una respuesta que dejé arriba comento el flujo que estoy realizando, entonces si coloco el código que me dices, al estar bien la validación, se quedará en la misma página.

Todas esas cosas créanme que las intenté, no soy de los que lee y no está seguro de cómo aplicarlo, así no se aprende.

Lo que se me ocurre para salir rápido del paso, es que si está todo bien, tirar un redireccionamiento y crear una sesión flash para que en la página de listado aparezca el mensaje de registro correcto.

Lo malo con eso es que tendría que hacerlo personalizado con todas las vistas de create y update en vez de realizar algo genérico.

Saludos y gracias.