1

Necesito validar los inputs creados en mis funciones add y edit. Lo he intentado con la función validate de jQuery, pero no funciona.

He intentado meter mi table dentro de un form, pero tampoco es la solución pues inserto una fila en la cual están los inputs y el botón que llama a la función guardar.

fn_Add

function fn_Add() {

    $("#tblFactores tbody").prepend("<tr>" +
        "<td><input type='text' class='form-upload input-sm' style='width: 100%'/></td>" +
        "<td class='text-center'><input type='checkbox' checked='checked'/></td>" +
        *"<td class='text-center'>" +
        "<a class='btn btn-info btn-circle save' href='javascript:;' title='Guardar' ><i  class='fa fa-save'></i></a>" +
        "<a class='btn btn-danger btn-circle cancel' href='javascript:;' title='Cancelar' ><i class='fa fa-ban'></i></a>" +
        "</td></tr>");*
};

edito una fila

function fn_Edit(elem) {

    var par = $(elem).parent().parent();
    var tdnombre_factor = par.children("td:nth-child(1)");
    var tdestado = par.children("td:nth-child(2)");
    var tdbuttons = par.children("td:nth-child(3)");
    var estado;

    tdnombre_factor.html("<input type='text' id='txtdescripcion' class='form-control input-sm' style='width: 100%' value='" + tdnombre_factor.html() + "'/>");
    estado = tdestado.children("i").hasClass("fa-square-o") ? "<input type='checkbox'/>" : "<input type='checkbox'  checked='checked'/>";
    tdestado.html(estado);
    tdbuttons.html('<a class="btn btn-primary btn-circle save"><i class="fa fa-save " title="Guardar"></i></a><a class="btn btn-danger btn-circle cancel" title="Cancelar"><i class="fa fa-ban"></i></a>');
};

Descripción view

Código en JSP

<table class="table table-striped table-bordered table-hover" id="tblFactores">
    <button type="button" class="btn btn-primary" name="btnAdd" id="btnAdd"> Agregar</button>                            
    <thead>
        <tr>                                    
            <th>Factor</th>                                    
            <th>Estado</th>
            <th>Acciones</th>
        </tr>
    </thead>
    <tbody>
            <%
            List < Factor > listafactores = FactorNEG.Instancia().Listar();
            for (int i = 0; i < listafactores.size(); i++) {
                int tipo = listafactores.get(i).getCodigo();
                out.println("<tr>");
                out.println("<td class='text-center'>" + listafactores.get(i).getDescripcion() + "</td>");
                if (listafactores.get(i).getEstado() == 1) {
                    out.println("<td class='text-center'><i class='fa fa-check-square-o'></i></td>");
                } else {
                    out.println("<td class='text-center'><i class='fa fa-square-o'></i></td>");
                }
            %> 
            <td class="text-center" data-id="<%=listafactores.get(i).getCodigo()%>" >
                <a href="javascript:;" class="btn btn-primary btn-circle edit" title="Editar"><i class="fa fa-edit"></i></a>
                <a href="javascript:;" class="btn btn-danger btn-circle remove " title="Eliminar"><i class="fa fa-remove"></i></a>
            </td>
        </tr>
        <%
            }   
        %>
    </tbody>  
</table>
6
  • Amigo, se ve que eres JAVERO ese código le quemaría los ojos a cualquier JS Developer decente, en fin vamos por partes. Podrías publicar el código HTML después de que lo compila el JSP por favor?. Ya que al final de cuentas vamos a trabajar con el JS, ya sea que tu JSP cree cosas dinamicamente :)
    – elporfirio
    Commented el 6 sept. 2016 a las 22:46
  • esta seguro del html? osea el codigo que me muestra en el navegador? (si es asi, puede ser en un print de paltalla, porque sino seria demasiado engorroso pegarlo aqui ) Commented el 7 sept. 2016 a las 7:55
  • 2
    Preguntas sobre cómo validar los campos, pero el código que incluyes no tiene absolutamente nada sobre validación. "Lo he intentado con la función validate de jQuery, pero no funciona", ¿cómo lo has intentado?¿cómo no funciona? (pega el código que intentaste y el error que obtuvieses).
    – Alvaro Montoro
    Commented el 7 sept. 2016 a las 14:00
  • Bueno intente hacer el mismo metodo de un form normal : Estos pasos (pd : el codigo esta en diferentres prints de pantalla) prntscr.com/cf8s5f prntscr.com/cf8u29 prntscr.com/cf8udk prntscr.com/cf8vsp Cuando apreto el boton guardar se ejecuta sin darme la validacion de que me impida guardar sin texto. PD : Alguien me puede explicar como dar un salto de linea en los comentarios (de este foro) y como insertar codigo en los comentarios. Ya lei la guia , pero igual no me sale :/ Commented el 7 sept. 2016 a las 15:03
  • 1
    igual, algo "fácil" es agregar la propiedad required a los input PERO como ya se ha mencionado, sin estar en un form no va a hacer algo, ni el validator de jQuery ni el atributo html5 required
    – Néstor
    Commented el 12 dic. 2016 a las 17:40

2 respuestas 2

0

Hola yo utilizo el siguiente metodo para validar los campos del formulario

primero a cada uno de los inputs o etiquetas que contengan un valor les aisgno una clase que se llame required por ejemplo:

<form id = 'formid'>
    <input  type="text" class=" required" name="name" >
    <input  type="text" class=" required" name="direccion" >
</form>

despues tengo esta funcion que la llamo cuando voy a guardar los datos:

function validate(formId){
    var validation = document.getElementById(formId).querySelectorAll(".required");
    var flag = true;
    for(var j = 0 ; j<validation.length; j++ ){ 
        if(validation[j].value === "" || validation[j].value === "none"){
            validation[j].style.backgroundColor = '#FF0000'; 
            flag = false;
        }   
    }
    return flag;
}

es muy simple

1
0

Tienes formas mas o menos elegantes de hacerlo. Una de ellas a bote pronto es que una vez que hagas click en guardar, llames a una función enviándole los campos necesarios pertenecientes a esa línea moviéndote por el DOM, recogerlos y a continuación enviarlos (lo suyo sería hacerlo con AJAX). Además por lo que veo utilizas datatables, que con row().data() obtienes cómodamente los valores en un array para tratarlos.

Otra opción es que generes un formulario en cada línea llamándolos algo como "prefijo-iddelínea, no sé si me explico:

            for (int i = 0; i < listafactores.size(); i++) {
                int tipo = listafactores.get(i).getCodigo();
                out.println("<tr>");
                out.println("<form name='loquesea" + idXXX + "' action='...'>");
                out.println("<td class='text-center'>" + listafactores.get(i).getDescripcion() + "</td>");
                ....
                out.println("</form>")
                ....

Con la segunda solución lo tienes mas fácil a la hora de validarlos, pues si le añades el atributo required más el tipo adecuado ya tienes las de HTML5, si no igual que el primero debes hacerlo manualmente o con librería.

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.