0

Tengo una tabla como la siguiente, en la cual se insertan datos, lo que quiero lograr es que al momento de presionar el boton se forme un arreglo el cual contenga cuatro arreglos cada uno de ellos con el valor de cada uno de los inputs.

El arreglo que necesito formar quedaría de la siguiente manera:

prametros = [
             0:[dato1: "xvalor", dato2: "xvalor",dato3: "xvalor",dato4: "xvalor", dato5: "xvalor"],
             1:[dato1: "xvalor", dato2: "xvalor",dato3: "xvalor",dato4: "xvalor", dato5: "xvalor"],
             2:[dato1: "xvalor", dato2: "xvalor",dato3: "xvalor",dato4: "xvalor", dato5: "xvalor"],
             3:[dato1: "xvalor", dato2: "xvalor",dato3: "xvalor",dato4: "xvalor", dato5: "xvalor"],
            ]

tengo el siguiente código peor no hace lo que necesito alguien que me pueda ayudar se lo agradecería mucho.

$("#btn-nuevo").click(function(){
            var parametros=[];
            var parame=[];
            $("table tbody tr").each(function(i,e){
                parametro = {    
                  "dato1" : $(this).val(),
                  "dato2" : $(this).val(),
                  "dato3" : $(this).val(),
                  "dato4" : $(this).val(),
                  "dato5" : $(this).val()
                }      
                
            });
            parametros.push(parametro);
            alert(parametros);
            console.log(parametros);

        });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<table class="table" border "1">
						<thead>
							<tr>
								<td>Opciones</td>
								<td>Dato 1</td>
								<td>Dato 2</td>
								<td>Dato 3</td>
								<td>Dato 4</td>
								<td>Dato 5</td>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td>Opcion 1</td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="text" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido" ></td>
							</tr>
							<tr>
								<td>Opcion 2</td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="text" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
							</tr>
							<tr>
								<td>Opcio 3</td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="text" class="form-control requerido" ></td>
								<td><input type="number" class="form-control requerido" ></td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
							</tr>
							<tr>
								<td>Opcion 4</td>
								<td><input type="number" class="form-control requerido" ></td>
								<td><input type="text" class="form-control requerido" ></td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
							</tr>
						</tbody>
					</table>
        <button id="btn-nuevo" type="button" class="btn btn-primary" style="margin-bottom:10px">
                 <i class="glyphicon glyphicon-plus"></i>
                 Agregar
             </button>

1 respuesta 1

3

Estas bien cerca. Solo tienes que recorrer los td de cada tr y agregar los td a un array de tr. Tambien hay que ignorar el primer indice de cada tr que son los que dicen Opcion 1, Opcion 2, etc., etc.

Aqui el codigo:

$("#btn-nuevo").click(function(){
            var parametros=[];
            var parame=[];
            $("table tbody tr").each(function(i,e){
            
                var tr = [];
                $(this).find("td").each(function(index, element){
                    if(index != 0) // ignoramos el primer indice que dice Option #
                    {
                    var td = {};
                    td["dato"+index] = $(this).find("input").val();
                    tr.push(td);
                    }
                });
                parametros.push(tr);    
            });
            
            console.log(parametros);
        });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<table class="table" border "1">
						<thead>
							<tr>
								<td>Opciones</td>
								<td>Dato 1</td>
								<td>Dato 2</td>
								<td>Dato 3</td>
								<td>Dato 4</td>
								<td>Dato 5</td>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td>Opcion 1</td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="text" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido" ></td>
							</tr>
							<tr>
								<td>Opcion 2</td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="text" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
							</tr>
							<tr>
								<td>Opcio 3</td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="text" class="form-control requerido" ></td>
								<td><input type="number" class="form-control requerido" ></td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
							</tr>
							<tr>
								<td>Opcion 4</td>
								<td><input type="number" class="form-control requerido" ></td>
								<td><input type="text" class="form-control requerido" ></td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
								<td><input type="number" class="form-control requerido"></td>
							</tr>
						</tbody>
					</table>
        <button id="btn-nuevo" type="button" class="btn btn-primary" style="margin-bottom:10px">
                 <i class="glyphicon glyphicon-plus"></i>
                 Agregar
             </button>

1
  • Gracias, amigo. :D
    – Soldier
    Commented el 18 oct. 2017 a las 18:20

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.