entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

2votos

Validar formulario antes de enviarlo al Servlet

Hola mi inquietud es la siguiente:

Estoy trabajando con JSP y Servlet, y en el JSP tengo un formulario, lo que no se es como podría validar los campos antes de que me redireccione al Servlet. Para ello utilizo la siguiente función

function validar() {    
    if (document.formCP.txtNombre.value === "") {
        alert("El campo Nombre no debe estar vacio. -" + accion + "-");
        document.formCP.txtNombre.focus();
        return false;
    }

    if (document.formCP.txtDescripcion.value === "") {
        alert("El campo Descripción no debe estar vacio.");
        document.formCP.txtDescripcion.focus();
        return false;
    }

    if (document.formCP.cbxProveedor.value === "Ninguno") {
        alert("Debe seleccionar un proveedor.");
        document.formCP.cbxProveedor.focus();
        return false;
    }

    return true;
}

Donde formCP es el nombre de mi formulario y lo que sigue después del punto es el nombre de mi campo. Un inconveniente es que en mi formulario tengo 2 botones, guardar y eliminar, donde realiza las respectivas acciones en base de datos, por lo tanto quiero que valide los campos de acuerdo al botón que se le de clic.

Por lo tanto, use el evento onclick en cada botón, y sí hace las validaciones pero aunque estén mal envía los datos erróneos al Servlet. Entonces intente con el evento onsubmit, pero este me valida por igual todos los campos sin importar que boton seleccione.

No se si con esto alguien me pudiera ayudar.

Gracias.

1 Respuesta

1voto

GusGarsaky Puntos5480

Simplemente coloca required a los inputs del formulario:

<form id="formCP" action="TuServlet">
    <input type="text" id="txtNombre" required>
    <input type="text" id="txtDescripcion" required>
    <select id="cbxProveedor" required>
        <option value="1">Proveedor X</option>
        <option value="2">Proveedor Y</option>
        <option value="3">Proveedor Z</option>
    </select>
    <input type="submit" value="Registrar">
</form>

Si no se ingresan/eligen valores en el formulario, la validación será automática y no te mostrará los errores (no deje el campo vacío). Ahora, si esto no fuese suficiente, puedes validar además que los valores ingresados en las cajas de texto sigan un patrón, esto lo haces mediante el atributo patern, por ejemplo:

<input type="text" id="txtNombre" pattern="[a-zA-Z]$" required>

La caja de texto anterior validará que no se deje vacía y que además solo se ingresen letras minúsculas y mayúsculas, mas no números (ideal para nombres).

Si el usaurio hace todo bien, el formulario será marcado como válido y se enviará la info al Servlet (puedes también enviar info al servler por AJAX).

UPDATE

Para poner mensajes personalizados en caso falle la validación, usa setCustomValidity. Por ejemplo:

<input type="text" id="txtNomtbre"pattern="[a-zA-Z]$"  oninvalid="setCustomValidity('Por favor ingresa solo letras')" required/>

El código anterior mostrará el mensaje: "Por favor ingresa solo letras".

Demo: http://jsfiddle.net/gpaagyhp/

0voto

Guadalupe Frausto comentado

Si, eso también ya lo intente, pero lo que no quiero es que aparezcan los mensajes predeterminados, a menos de que hubiera una forma de modificar esos mensajes.

2votos

GusGarsaky comentado

Los comentarios a respuestas como comentarios, no es necesario responder (no es un foro). Ve mi update, ahí he puesto lo que te interesa.

Saludos.

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta