[SOLUCIONADO] Problema para dividir el contenido de 2 divs

unexes · #1 (**permalink**) 29/11/2015, 06:58

Buenas a tod@s.

Vereis tengo el código que os pongo a continuación, esta funcionando correctamente tal cual esta ahora, pero necesito que haga algo mas y eso no he conseguido hacerlo por lo tanto os detallo mi problema.

Lo que hace este código es leer de una base de datos y rellenar el "selector" y cuando cambiamos el valor del mismo "selA4" me pone en el <div id="Cantidad"> la cantidad seleccionada y en el <div id="Tarifa"> el valor correspondiente del campo "descripcion" de mi base de datos, y si el valor de descripcion es ==0 me aparece un texto, ambos campos de mi base MySql son del tipo Int y longitud 5

Lo que necesito es que en el div que llamo "PrecioUnidad" aparezca el valor resultante de la división del valor del div "Tarifa" dividido por el valor del div "Cantidad" con el fin de obtener en el div "PrecioUnidad" el precio por unidad ("Tarifa" dividido por "Cantidad").

Tal como esta ahora en el div "PrecioUnidad"me aparece "NaN"
Espero haberme explicado bien aunque he sido un poco repetitivo, supongo que habrá otras maneras de obtener el precio por unidad, si alguien quiere sugerirme alguna otra forma estaré encantado en estudiar su idea.

Código Javascript:

Ver original<!DOCTYPE html>
<html> 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" >
        <link rel="stylesheet" type="text/css" href="../css/cav.css" />
<head>
        <?php          
        require_once('../Connections/TuZonaPublicidad.php');
        mysqli_query($conexion, "SET NAMES 'utf8'");
        ?>
<body>
<div id="A4">                
                <div id="Selector">
    <select name="sel_A4" id="sel_A4" class="select" onchange="mostrar(this, 'Cantidad', 'Tarifa', 'Conjunto' );">
            <?php
                $tablaseleccionA4 = mysqli_query($conexion,"SELECT * FROM cartelesvinilo WHERE Activacion = '1' And Tamano= 'CTA4' ORDER BY Cantidad ASC");
                    while ($registroseleccionA4  = mysqli_fetch_array($tablaseleccionA4 ))
                    echo "<option value=".$registroseleccionA4['Cantidad']." data-description=".$registroseleccionA4['Descripcion_Precio'].">&nbsp;&nbsp;".number_format($registroseleccionA4['Cantidad'], 0, ',', '.')."</option>";
                mysqli_free_result($tablaseleccionA4);
            ?>
   </select>
                </div>
               
                <div id="Cantidad" class="presentacion_cantidad"></div>               
                <div id="Tarifa" class="tarifa"></div>                
                <div id="Conjunto">Esto es solo texto que aparece cuando no hay valor en descripcion</div>                
                <div id="PrecioUnidad" class="tarifa"></div> <!--Aquí es donde aparece el famoso "NaN"-->
</div><!-- Cierro A4 -->
 
 <script type="text/javascript">
function mostrar( obj, valueDiv, nameDiv, conjuntoDiv){
    var container = document.getElementById(nameDiv);
    var container1 = document.getElementById(valueDiv);
    container1.innerHTML = obj[ obj.selectedIndex ].value.replace(/\B(?=(\d{3})+(?!\d))/g, ".");    
    var container2 = document.getElementById(conjuntoDiv) ;
    
    resultado=parseInt(document.getElementById("Tarifa").value) / parseInt(document.getElementById("Cantidad").value);
    PrecioUnidad.innerHTML = resultado;
        
    var description = obj[ obj.selectedIndex ].dataset.description;
        if (description == 0){
            document.getElementById(nameDiv).style.display ="none";
            document.getElementById(valueDiv).style.display ="none";
            document.getElementById(conjuntoDiv).style.display ='block';                
        } else {
            container.innerHTML = description;
            document.getElementById(nameDiv).style.display ="block";
            document.getElementById(valueDiv).style.display ="block";
            document.getElementById(conjuntoDiv).style.display ='none'; 
    }
}
mostrar(document.getElementById("sel_A4"),"Cantidad", "Tarifa", "Conjunto");
</script>
</body>
</html>

Espero me podáis ayudar, Gracias.

Alexis88 · #2 (**permalink**) 29/11/2015, 11:38

No obtienes valor alguno ya que los <div> no poseen el atributo value. Puedes tomar su contenido mediante la propiedad innerHTML. Y como sugerencia, para tomar el valor seleccionado en el <select>, hazlo de manera directa utilizando el atributo value.

Línea 34 del código que muestras:

Código Javascript:

Ver originalcontainer1.innerHTML = obj.value.replace(/\B(?=(\d{3})+(?!\d))/g, ".");

Un saludo

unexes · #3 (**permalink**) 30/11/2015, 13:26

Gracias Alexis 88

Con tu aclaración lo he podido solucionar, muchas gracias.