JavaScript - ayuda con sumatorias en una tabla de html

 
Vista:

ayuda con sumatorias en una tabla de html

Publicado por Cristian Camilo Barbosa (1 intervención) el 04/05/2018 16:43:24
buen dia;

estoy tratando de realizar una pagina en la que pueda el cliente modificar las cantidades y al mismo tiempo pueda ver un subtotal y total automaticamente mientras avanza en la pagina web, encontre un foro donde funcionaba sobre una sola linea, el problema con mi codigo es que no es solo una linea si no un poco mas de 300 items, remito el codigo html (una parte) y el java por si alguien me puede colaborar modificando el codigo para que funcione como lo necesito.
gracias de antemano. lo ideal es que me fuera multiplicando en la 4 columna y me fuera dando una sumatoria total en la ultima celda "totales"

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<div class="tabla"><table>
       <tr class="encabezado">
           <td>
               <h2>UND</h2>
           </td>
           <td>
               <h2>LENCERIA PARA EVENTOS</h2>
           </td>
           <td>
               <h2>VR/UNI</h2>
           </td>
           <td>
               <h2>SUBTOTAL</h2>
           </td>
       </tr>
       <tr>
       <td>
      <input type="text" name="Precio" id="Precio" value="0" class="monto" onkeyup="multi();">
      </td><td><p>Forro de silla estandar</p></td>
    <td>
     <input type="hidden" name="Cantidad" id="Cantidad" value="1300" class="monto">1300
     </td>
  <td>
    <label id="Costo">
      <input type="text" name="Costo" disabled>
    </label>
  </td></tr>
       <tr>           <td>
      <input type="text" name="Precio" id="Precio" value="0" class="monto" onkeyup="multi();">
      </td><td><p>
Forro silla de color</p></td>
    <td>
     <input type="hidden" name="Cantidad" id="Cantidad" value="2900" class="monto">2900 </td>
  <td>
    <label id="Costo">
      <input type="text" name="Costo" disabled>
    </label>
  </td></tr>
<tr>
       <td>
      <input type="text" name="Precio" id="Precio" value="0" class="monto" onkeyup="multi();">
      </td><td><p>
Fajon moño de color delgado</p></td>
    <td>
     <input type="hidden" name="Cantidad" id="Cantidad" value="400" class="monto">400 </td>
  <td>
    <label id="Costo">
      <input type="text" name="Costo" disabled>
    </label>
  </td></tr>
 
<tr>
<TR class="encabezado">
       <td colspan="3">TOTALES
       </td>
           <td class="valor5">
           <input name="" type="text" class="total" id="" value="0" size="12">
       </td>
   </TR> </table>
</div>

el script es el siguiente:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function multi(){
    var total = 1;
    var change= false; //
    $(".monto").each(function(){
        if (!isNaN(parseFloat($(this).val()))) {
            change= true;
            total *= parseFloat($(this).val());
        }
    });
    // Si se modifico el valor , retornamos la multiplicación
    // caso contrario 0
    total = (change)? total:0;
    document.getElementById('Costo').innerHTML = total;
}
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder