How to traverse an array of html with JQuery or javascript?

Question

How to traverse an array of html with JQuery or javascript?

Navigation

#1 by (2 votes)

1

I have the following code:

<td>
    <input type="text" name="listPeso[]" class="input_next autoNumeric" data-v-min="0.000" data-v-max="999999999999999999999.999" data-a-sep="" data-a-dec="."  onkeyup="runScript(event,this)">
</td>

Which are increased as needed by the user, so I would have N tags with the name of listPeso[] , which I must add to show the total weight.

The problem is:

I do not know how to traverse them with javascript or with JQuery.

Try something like:

var dom=document.getElementsByName("listPeso[]");
console.log(dom);

To obtain the data, but they are empty, also try with:

$("input[name='listPeso[]']").each(function(indice, elemento) {
    console.log('El elemento con el índice '+indice+' contiene '+$(elemento).text());
});

But I do not get results.

javascript jquery html

asked by Shassain 23.08.2018 в 17:07

source

1 answer

preventDefault () - Before sending by PHP A BBDD (jQuery) Blank page in ReportViewer

score 2 · Accepted Answer

You must bear in mind that to capture the value of a input the method .val() and not .text() is used.

I removed the onkeyup in the example so that it did not generate errors when executing the snippet.

$("#ejecutar").click(function(){
  $("input[name='listPeso[]']").each(function(indice, elemento) {
    console.log('El elemento con el índice '+indice+' contiene '+$(elemento).val());
});
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<td>
    <input type="text" name="listPeso[]" class="input_next autoNumeric" data-v-min="0.000" data-v-max="999999999999999999999.999" data-a-sep="" data-a-dec=".">
</td>

<td>
    <input type="text" name="listPeso[]" class="input_next autoNumeric" data-v-min="0.000" data-v-max="999999999999999999999.999" data-a-sep="" data-a-dec=".">
</td>

<td>
    <input type="text" name="listPeso[]" class="input_next autoNumeric" data-v-min="0.000" data-v-max="999999999999999999999.999" data-a-sep="" data-a-dec=".">
</td>

<button id="ejecutar">Ejecutar</button>