JavaScript - Mostrar el valor de un select

 
Vista:
sin imagen de perfil
Val: 13
Ha disminuido su posición en 8 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

Mostrar el valor de un select

Publicado por Unexes (39 intervenciones) el 11/02/2017 16:29:49
Hola a tod@s.

Veréis me he encontrado con un problema y después de un montón de pruebas tengo que recurrir a vosotros para intentar solucionarlo, por lo tanto os doy las gracias por anticipado.

Tengo el código que expongo a continuación, lo que pretendo es que se pueda calcular un costo a partir de seleccionar una Cantidad de una base de datos, de la misma cojo la "TarifaMillar" hago una operación y la muestro en "SubTotal_Precio_Base" hasta aquí todo bien, al entrar en la página me muestra el total de la cantidad menor que se encuentra en la base de datos, ESTO ES CORRECTO, y si escojo otra cantidad me actualiza todo la cantidad, el precio por millar y el "SubTotal_Precio_Base".

Pero a ese "SubTotal_Precio_Base" tengo que seguir sumándole otras cantidades y doy la opción con un select "sel_caras_impresion" de elegir "1 cara" o "2 caras" segun lo que se elije hay un value distinto que quiero mostrar en el div "Valor_Caras_Impresion" para luego sumarlo al valor "SubTotal_Precio_Base" y mostrarlor en otro div que se llamara "TOTAL".

Mi problema es que de entrada NO me muestra en el div "Valor_Caras_Impresion" el value que hay por defecto seleccionado en el select "sel_caras_impresion", solo si cambio entre 1 cara y 2 caras en dicho select me muestra el valor, pero de entrada NO.

¿Como lo soluciono? GRACIAS

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
61
62
63
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" >
<link rel="stylesheet" href="../css/tlc.css" type="text/css" />
</head>
        <?php
		require_once('../Connections/miconexion.php');
		mysqli_query($conexion, "SET NAMES 'utf8'");
		?>
<body>
		  <div id="Selector">
   					 <select name="selCantidad" id="selCantidad" class="select" onchange="mostrar(this, 'Cantidad', 'TarifaMillar', 'SubTotal_Precio_Base', 'Valor_Caras_Impresion');">
			<?php
    			$tablaseleccion = mysqli_query($conexion,"SELECT * FROM tarjetas WHERE Activacion = '1' ORDER BY Cantidad ASC");
    				while ($registroseleccion  = mysqli_fetch_array($tablaseleccion ))
					echo "<option value='".$registroseleccion['Cantidad']."' data-description='".$registroseleccion['Precio_Millar']."'>&nbsp;&nbsp;".number_format($registroseleccion['Cantidad'], 0, ',', '.')."</option>";
				mysqli_free_result($tablaseleccion);
			?>
  					 </select>
			</div>
 
            <div id="Cantidad" class="presentacion_cantidad"></div>
 
            <div id="TarifaMillar" class="tarifa1"></div>
 
            <div id="SubTotal_Precio_Base" class="tarifa1"></div>
 
 
            <div id="Impresion">
        			<select name="sel_caras_impresion" id="sel_caras_impresion" class="select"  onchange="mostrar(this, 'Valor_Caras_Impresion');">
        				<option value="5" selected>1 cara</option>
        				<option value="7">2 caras</option>
        			</select>
       		</div>
 
        	<div id="Valor_Caras_Impresion" class="tarifa1"></div>
 
<script type="text/javascript">
function mostrar( obj, Cantidad, TarifaMillar, TarifaDiv, Valor_Caras_Impresion ){
	var tarifamillar = document.getElementById(TarifaMillar) ;
	var container1 = document.getElementById(Cantidad) ;
	container1.innerHTML = obj[ obj.selectedIndex ].value.replace(/\B(?=(\d{3})+(?!\d))/g, ".") ;
 
	document.getElementById("Valor_Caras_Impresion").value = document.getElementById("sel_caras_impresion").value
 
    var description = obj[ obj.selectedIndex ].dataset.description;
		if (description == 0){
 
		} else {
			tarifamillar.innerHTML = description;
	}
 
		SubTotal_Precio_Base=parseInt(document.getElementById(TarifaMillar).innerHTML.replace('.', ""))*parseInt(document.getElementById(Cantidad).innerHTML.replace('.', ""))/1000;
			document.getElementById(TarifaDiv).innerHTML = SubTotal_Precio_Base.toFixed(0) +' €';
 
}
 
mostrar(document.getElementById("selCantidad"),"Cantidad", "TarifaMillar", "SubTotal_Precio_Base", "Valor_Caras_Impresion");
</script>
 
</body>
</html>
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
sin imagen de perfil
Val: 9
Ha disminuido su posición en 2 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

Mostrar el valor de un select

Publicado por Alvaro (4 intervenciones) el 21/02/2017 19:51:14
Hola Unexes,

Agrega esto al final.

1
2
3
window.onload = () => {
	document.getElementById('sel_caras_impresion').onchange();
};
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 13
Ha disminuido su posición en 8 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

Mostrar el valor de un select

Publicado por Unexes (39 intervenciones) el 21/02/2017 23:40:47
Alvaro gracias por tu ayuda.

Al colocarlo me da un error de sintaxis y no funciona.

Pero sigo sin entender como puedo de entrada mostrar todos los contenidos de los divs menos el del div "Valor_Caras_Impresion", Este solo muestra su contenido cuando cambio la selección del select "sel_caras_impresion".

Enfin estoy atascado ya varios días y no se como resolverlo ya que he probado multitud de cosas y nada.

Espero encontrar la forma de resolverlo pronto.

Gracias por vuestra ayuda.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de xve
Val: 3.162
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Mostrar el valor de un select

Publicado por xve (2100 intervenciones) el 22/02/2017 08:08:49
Lo que te ha puesto Alvaro, la verdad es que nunca lo habia visto!!! prueba así:

1
2
3
window.onload = function() {
    document.getElementById('sel_caras_impresion').onchange();
}
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 13
Ha disminuido su posición en 8 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

SOLUCIONADO: Mostrar el valor de un select

Publicado por Unexes (39 intervenciones) el 22/02/2017 09:56:47
Gracias xve.

Funciona correctamente, ahora puedo continuar.

Disculpadme, pero aprovecho para haceros 2 breves preguntas porque los divs y los calculos entre los valores van a ser bastantes.

La primera ¿creeis que el planteamiento y desarrollo del código es correcto o lo haríais de otra forma?. Lo plantee así porque dependo de una base de datos que ya existe en Mysql y donde cada cantidad tiene asignada un determinado precio en el mismo registro y la verdad es que no se me ocurrió hacerlo de otra forma.

Segunda cuando coloque otros divs debo de ampliar este código con el que tan amablemente me habéis ayudado de esta forma.

1
2
3
4
5
window.onload = function() {
    document.getElementById('sel_caras_impresion').onchange();
    document.getElementById('sel_loquesea_1').onchange();
    document.getElementById('sel_loquesea_2').onchange();
}
etc...

Muchas gracias por vuestra ayuda xve, Alvaro.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 9
Ha disminuido su posición en 2 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

SOLUCIONADO: Mostrar el valor de un select

Publicado por AFSM (4 intervenciones) el 28/02/2017 18:24:38
Hola Unexes,
El código de la manera que lo estás haciendo no está con las mejores prácticas de la programación pero sin duda funcionará.
Acerca del código que se te dio compartió lo explicaré y verás si es necesario agregar más select's.
1
2
3
4
5
6
// Ésto crea un evento el cual se desencadenará cuando la carga de la pagina esté completa.
window.onload = function() {
    // Ésto fuerza o solicita la ejecucíon del evento onChange - (en caso de tener uno vinculado).
    // Es por esta razón que cuando tu pagina se carga, ejecuta el evento que actualiza la información de tu Div en la parte inferior de la página.
    document.getElementById('sel_caras_impresion').onchange();
}
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 9
Ha disminuido su posición en 2 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

Mostrar el valor de un select

Publicado por AFSM (4 intervenciones) el 28/02/2017 18:17:25
Hola chicos, que pena, se me fue, lo que he puesto es EcmaScript6, nuevo estándar de Javascript y quizás por compatibilidad de algún navegador que estés usando te genera error, porque a decir verdad prácticamente todos son compatibles ya.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar