forma de repetición de una mesa de filas y obtener los valores de las celdas usando jQuery

Question

estoy creando la siguiente tabla dinámica utilizando jQuery ... Después de ejecutar mi código consigo la tabla de la siguiente manera:

<table id="TableView" width="800" style="margin-left: 60px"> 
<tbody> 
<tr> 
<th>Module</th> 
<th>Message</th> 
</tr> 
<tr class="item"> 
<td> car</td> 
<td> 
    <input class="name" type="text"> 
</td> 
<td> 
<input class="id" type="hidden" value="5"> 
</td> 
    </tr> 
<tr class="item"> 
<td> bus</td> 
<td> 
    <input class="name" type="text"> 
</td> 
<td> 
<input class="id" type="hidden" value="9"> 
</td> 
    </tr> 

Solía recorrer la tabla siguiente manera:

$("tr.item").each(function() { 
      var quantity1 = $this.find("input.name").val(); 
     var quantity2 = $this.find("input.id").val(); 

      }); 

mediante el uso de la consulta anterior que estoy recibiendo valores de sólo las células primera fila ... ayudarme con jQuery que recorrer toda la filas de la tabla y obtener los valores de las celdas de fila en quantity1 y quantity2.

Answer 1

$(this) en lugar de $ este

$("tr.item").each(function() { 
     var quantity1 = $(this).find("input.name").val(), 
      quantity2 = $(this).find("input.id").val(); 
}); 

Proof_1:

proof_2:

Answer 2

obtuviste la respuesta, pero ¿por qué iterar sobre el tr cuando se puede ir directamente a las entradas? De esta forma, puede almacenarlos más fácilmente en una matriz y reducir el número de consultas de CSS. Depende de lo que quieras hacer, por supuesto, pero para recopilar datos es un enfoque más flexible.

http://jsfiddle.net/zqpgq/

var array = []; 

$("tr.item input").each(function() { 
    array.push({ 
     name: $(this).attr('class'), 
     value: $(this).val() 
    }); 
}); 

console.log(array);​ 

Answer 3

Hola cada uno gracias por la ayuda a continuación es el código de trabajo para mi pregunta

     $("#TableView tr.item").each(function() { 

      var quantity1=$(this).find("input.name").val(); 
      var quantity2=$(this).find("input.id").val(); 


      }); 

Answer 4

bucle a través de una tabla para cada fila y la lectura de las obras 1er valor de columna mediante el uso de JQuery y lógica DOM.

var i = 0; 
var t = document.getElementById('flex1'); 

$("#flex1 tr").each(function() { 
    var val1 = $(t.rows[i].cells[0]).text(); 
    alert(val1) ; 
    i++; 
}); 

Answer 5

I got it and explained in below:      
//This table with two rows containing each row, one select in first td, and one input tags in second td and second input in third td; 
<table id="tableID" class="table table-condensed"> 
              <thead> 
               <tr> 
                <th><label>From Group</lable></th> 
                <th><label>To Group</lable></th> 
                <th><label>Level</lable></th> 



               </tr> 
              </thead> 
              <tbody> 
       <tr id="rowCount"><td><select ><option value="">select</option><option value="G1">G1</option><option value="G2">G2</option><option value="G3">G3</option><option value="G4">G4</option></select></td><td><input type="text" id="" value="" readonly="readonly" /></td><td><input type="text" value="" readonly="readonly" /></td></tr> 
      <tr id="rowCount"><td><select ><option value="">select</option><option value="G1">G1</option><option value="G2">G2</option><option value="G3">G3</option><option value="G4">G4</option></select></td><td><input type="text" id="" value="" readonly="readonly" /></td><td><input type="text" value="" readonly="readonly" /></td></tr> 
       </tbody> 


              </table> 

     <button type="button" 
             class="btn btn-default generate-btn search-btn white-font border-6 no-border" 
             id="saveDtls">Save</button> 


        //call on click of Save button; 
        $('#saveDtls').click(function(event) { 

        var TableData = []; //initialize array; 

         var data=""; //empty var; 
          //Here traverse and read input/select values present in each td of each tr, ; 
         $("table#tableID > tbody > tr").each(function(row, tr) { 

         TableData[row]={ 
         "fromGroup": $('td:eq(0) select',this).val(), 
         "toGroup": $('td:eq(1) input',this).val(), 
         "level": $('td:eq(2) input',this).val() 


         }; 

         //Convert tableData array to JsonData 
         data=JSON.stringify(TableData) 
         //alert('data'+data); 


         }); 

    });