Adding inputs to a report with more than one table!

Question

Adding inputs to a report with more than one table!

Navigation

#1 by (5 votes)

4

I am generating a report and it has several tables. In jQuery I have to add 2 inputs of each table, the problem is that it only adds the one of the first table. I tried to use next() , but it did not work.

Follow the HTML code:

<td id=\"tabela\">
<input type=\"text\" id=\"tabelainput\" class=\"janmembros\" maxlength=\"3\" name=\"janmembros\" value=\"$row[janmembros]\" disabled>
</td>
<td id=\"tabela\">
<input type=\"text\" id=\"tabelainput\" class=\"janvisitantes\" maxlength=\"3\" name=\"janvisitantes\" value=\"$row[janvisitantes]\" disabled>
</td>
<td id=\"tabela3\" class=\"jantotal\">
</td>

<td id=\"tabela\">
<input type=\"text\" id=\"tabelainput\" class=\"janmembros\" maxlength=\"3\" name=\"janmembros\" value=\"$row[janmembros]\" disabled>
</td>
<td id=\"tabela\">
<input type=\"text\" id=\"tabelainput\" class=\"janvisitantes\" maxlength=\"3\" name=\"janvisitantes\" value=\"$row[janvisitantes]\" disabled>
</td>
<td id=\"tabela3\" class=\"jantotal\">
</td>

<td id=\"tabela\">
<input type=\"text\" id=\"tabelainput\" class=\"janmembros\" maxlength=\"3\" name=\"janmembros\" value=\"$row[janmembros]\" disabled>
</td>
<td id=\"tabela\">
<input type=\"text\" id=\"tabelainput\" class=\"janvisitantes\" maxlength=\"3\" name=\"janvisitantes\" value=\"$row[janvisitantes]\" disabled>
</td>
<td id=\"tabela3\" class=\"jantotal\">
</td>

jQuery:

if ( $( ".janmembros" ).val().length >= 1 && $( ".janvisitantes" ).val().length >= 1 )
{
$( ".jantotal" ).html( parseInt($( ".janmembros" ).val()) + parseInt($( ".janvisitantes" ).val()) );
}

JSFiddle

jquery

asked by anonymous 03.07.2014 / 21:47

1 answer

High memory consumption Swing Java application Apache Maven Scopes Usage Scenarios

score 5 · Accepted Answer

Because you contain multiple elements to be localized to perform the operation of summing values and displaying the result, you can use the iteration function .each () of jQuery that will allow you for each group of localized elements to perform a certain operation on them:

Example to Work in JSFiddle

// se estão presentes e não estão vazios
if ( $( ".janmembros" ).val() != '' && $( ".janvisitantes" ).val() != '' )
{

    // por cada tabela encontrada
    $('table').each(function() {

        /* coloca em cache o objecto referente à tabela
         * e trabalha com os elementos dentro da mesma
         */
        var $this = $(this),                                             // cache da <table>
            janmembros = parseInt($this.find( ".janmembros" ).val()),
            janvisitantes = parseInt($this.find( ".janvisitantes" ).val());

        // soma e enviar para o destino
        $this.find( ".jantotal" ).html( janmembros+janvisitantes ); 
    });
}