1 respuesta en este tema

[shinneo]

Hola, os cuento lo que tengo.

Tengo un pagina hecha en php con un listado de productos que los coge de la base de datos en la cual  al lado del producto aparece el precio y al lado de este un select para poder seleccionar entre 1 y 10 productos, todo esto funciona perfecto, el problema esta en que quiero que al lado de el select aparecezca el total de lo que cuesta lo que haya seleccionado el cliente, es decir, si el producto vale 100 y el cliente selecciona en el select 3, inmediatamente el campo total deberia actualizarse en 300.
Me gustaria hacerlo en javascript

Este es el codigo php

delphi

    <?php
$trabajoinstan=new Trabajo();
                    $listandoproductos=$trabajoinstan->listaSoloProductosporId($_GET["categoriaxjavascript"]);
                   for ($i = 0; $i < count($listandoproductos); $i++)
                    {
                      ?>
                   
                    <tr class="fuenteParisian fuente20">
                        <td class=" centradovertical"><?php echo ucfirst($listandoproductos[$i]["producto"]);?></td>
                        <td id="precio"><?php echo ucfirst($listandoproductos[$i]["precio"]);?>&nbsp; €</td>
                       <td id="cantidad">
                            <div class="selectcantidad">
                              
                                 <select id="cantidad"  >
                                     <?php
                                        for ($j = 1; $j <= 10; $j++) 
                                        {
                                     ?>  
                                    <option value="<?php echo $j; ?>"> <?php echo $j; ?>  </option>
                                    <?php
                                     
                                        }
                                     ?> 
                                 </select>
                            </div>
                       </td>
                       <td>
                           <div class="form-group">
                               <input type="checkbox" class="form-control"/>
                           </div>
                       </td>
                      
                       
                       <td>
                           <input type="text" onmouseover="calculaTotal();" />
                       </td>
                      
                   </tr>
                   <?php                   
}
                   ?>

y esta es la funcion javascript que he hecho

delphi

function calculaTotal()
{
   var total;
   var precio;
   var cantidad;
   precio=document.getElementById('precio').value;
   cantidad=document.getElementById('cantidad').value;
   total=precio*cantidad;
   return total;
}

no me funciona, pero pienso que es por que no se integrarla bien, y ademas al tener que coger el valor a multiplicar de un bucle for, pienso que no lo estoy haciendo correctamente, la idea es que al mover el select, el total se incremente.

Si me pudierais echar una mano, me ayudaria bastante

Gracias.

[porfi.dev]

Amigo te falta mucho que aprender... hay algo que se llama Traversing, que es la navegacion y ubicación de elemtos a traves del DOM, Jquery es Traversing en DOM y en Objects JSON, dominandolos estas del otro lado.

Este es un ejemplo de lo que quieres hacer:

http://jsfiddle.net/...firio/zcusn0dp/

Ahora veras lineas que te sacaran de onda, en fin

parseInt(), parseFloat() pasan un texto (string) a un número, debes de hacerlo por que si no la operación no se hace

el $(this) es el select, que esta dentro de la celda <td class=".cantidad">  ya que van a existir varias, NO debes utilizar IDS, por eso se utilizan clases.


YA que quedo Claro

$(this) es el select,
.parent() es el contenedor padre, en este caso <td class='.cantidad'>
.prev() es el contenedor hermano anterior, es decir a nivel del padre el anterior, que es solo un <td> (el del precio)
.text() pues es el texto que contiene (en el ejemplo 12.80 y 17)


Ese texto lo pasamos a numero, lo multiplicamos y hacemos la misma operación para buscar la celda donde queremos escribir. Ocupamos toFixed(2) para que el numero sea con 2 decimales nadamas.



Practicalo, estudialo y mucha suerte.

A por cierto.. $('.cantidad').on("change", "select", function(){    se debe leer así:


Dentro de todos los elementos con la clase ".cantidad"
Al ejecutarse el evento "change"
de los elementos tipo "select" dentro del elemento principal
Ejecutar la siguiente función o método