[SOLUCIONADO] Validar filas de una tabla HTML+JAVASCRIPT

[CHAEEZ]

Hola chicos, tengo un pequeño dilema que me aqueja. Necesito ingresar filas de forma dinamica a una tabla HTML mediante JavaScript. Hasta ahi todo bien, pero ahora necesito validar si un dato se repite. Este es el codigo que tengo hasta el momento.

Código Javascript:

if(i!=0){       
            if (document.getElementById("codigoProd") != null && document.getElementById("codigoproducto") != null)
            {   
                var codDetalle = document.getElementById("codigoProd").value;
                var codTabla = document.getElementById("codigoproducto").value; 
                    if(codDetalle != codTabla){
                        $(objTabla).find('tbody').append(strNueva_Fila);    
                        
                    } else {
                        alert("El producto ya fue ingresado.");
                    
                    }
                    
            } 
            $(objTabla).find('tbody').append(strNueva_Fila);    
        }
 

espero me ayuden porfavor

[diurno10]

y la estructura de la tabla?

[CHAEEZ]

lo siento, ayer hice el post muy a la rapida.

La estructura de la tabla seria esta:

Código HTML:

<table id="tablaProd" class="table table-hover">
<thead>
<tr>
<th>CÓDIGO</th>
<th>NOMBRE</th>
<th>UNIDAD</th>
<th>CANTIDAD</th>
<th></th>
<th></th>
</tr>
</thead>
<tbody id="tablaProds" >
</tbody>
</table>
 

Esta seria la estructura de la fila de la tabla:

Código Javascript:

var numero = 1;
 
 //evento que se dispara al hacer clic en el boton para agregar una nueva fila
    $(document).on('click','.clsAgregarFila',function(){
        //almacenamos en una variable todo el contenido de la nueva fila que deseamos
        //agregar. pueden incluirse id's, nombres y cualquier tag... sigue siendo html
        var codigo =  document.getElementById("codigoProd").value;
        var filas = document.getElementsByTagName("tr");
        var nombre =  document.getElementById("nombreProd").value;
        var unidad =  document.getElementById("um").value;
        var cantidad =  document.getElementById("cantidadProd").value;
        var i;
 
        var strNueva_Fila=
                '<tr>'+
                '<td><input type="text" id="codigoproducto'+(numero++)+'" value="'+codigo+'" maxlength="40" disabled></input></td>'+
                '<td><input type="text" id="nombreProd" value="'+nombre+'" disabled></input></td>'+
                '<td><input type="text" id="unidadProd" value="'+unidad+'" disabled></input></td>'+
                '<td><input type="text" id="cantidadProd" value="'+cantidad+'"  disabled></input></td>'+
                '<td><input type="hidden" id="dejarcero" disabled></input></td>'+
                '<td <button type="button" id="eliminarFila" onClick="eliminaFila(this)" >-</button></td>'+
                '</tr>';
                
 
        var objTabla=document.getElementById("tablaProd");  // capturamos la id de la tabla
 
        $(objTabla).find('tbody').append(strNueva_Fila);     //agregamos la nueva fila.
    
 
    });
 

Y algo asi tenia para que validara cuando un codigo ya fue ingresado a la tabla.

Código Javascript:

if (document.getElementById("codigoProd") != null)
         {   
        var codDetalle = document.getElementById("codigoProd").value;
        var valor = parseInt(codDetalle);
            if (document.getElementById("codigoproducto1") != null){
                    var codTabla = document.getElementById("codigoproducto1").value;
                    var numDetalle = parseInt(codTabla);
                    
                    if(valor === numDetalle){
                        alert("El producto ya fue ingresado.");
                    } else {
  $(objTabla).find('tbody').append(strNueva_Fila);  
     }
                }
            }
 

[diurno10]

Estimo q arriba de la tabla hay un formulario donde recojo los valores de:
var codigo = document.getElementById("codigoProd").value;
var nombre = document.getElementById("nombreProd").value;
var unidad = document.getElementById("um").value;
var cantidad = document.getElementById("cantidadProd").value;

[CHAEEZ]

Exacto don diurno10. Esos datos los recojo de un formulario. Los dato me los toma, de hecho el codigo en si esta bien.. lo que no funciona es la comparación entre el dato que se ingresa y el que esta en la tabla para asi evitar que se repita el dato en esta.

[diurno10]

bueno ahi me funciona, fijate q al input id="codigoproducto' le agregue una clase .codprod, xq manejarse con id en estos casos es muy engorroso.

Código Javascript:

function f_valida_repetido(){
        if ($('table#tablaProd tbody tr').length > 0){
            var v_valor = 0;
            $('table#tablaProd tbody tr').each(function(){
                if ($(this).find('input.codprod').val() == $("#codigoProd").val()){
                    alert('valor repetido');
                    v_valor = 1;
                }
            });
                    
            if(v_valor == 1){
                return false;
            }else{
                return true;
            }
        }else{
            return true;
        }           
            
    }
 

Código Javascript:

$('a.clsAgregarFila').click(function(){
    
            if (f_valida_repetido()){
                //almacenamos en una variable todo el contenido de la nueva fila que deseamos
                //agregar. pueden incluirse id's, nombres y cualquier tag... sigue siendo html
                var codigo =  $("#codigoProd").val();
                var filas = document.getElementsByTagName("tr");
                var nombre =  $("#nombreProd").val();
                var unidad =  $("#um").val();
                var cantidad =  $("#cantidadProd").val();
                var i;
         
                var strNueva_Fila=
                        '<tr>'+
                        '<td><input type="text" class="codprod" id="codigoproducto'+codigo+'" value="'+codigo+'" maxlength="40" disabled></input></td>'+
                        '<td><input type="text" id="nombreProd" value="'+nombre+'" disabled></input></td>'+
                        '<td><input type="text" id="unidadProd" value="'+unidad+'" disabled></input></td>'+
                        '<td><input type="text" id="cantidadProd" value="'+cantidad+'"  disabled></input></td>'+
                        '<td><input type="hidden" id="dejarcero" disabled></input></td>'+
                        '<td <button type="button" id="eliminarFila" onClick="eliminaFila(this)" >-</button></td>'+
                        '</tr>';
                        
         
                $('#tablaProd').find('tbody').append(strNueva_Fila);     //agregamos la nueva fila.
                return false;
            }
        
    });
 

[CHAEEZ]

Lo probare. Cualquier cosa te dire como me fue.


Edito: Sigue pasando lo mismo. Se repiten los codigos. u.u

[CHAEEZ]

Encontre el problema, fue de despistado y me respondi solo jaja. Efectivamente no le estaba pasando el nombre de la clase al input. Gracias por la ayuda diurno.