Foros del Web » Programando para Internet » Javascript »

capas y suma de valores

Estas en el tema de capas y suma de valores en el foro de Javascript en Foros del Web. Buenas compañeros: No se mucho de javascript pero bueno estoy en ello, pero me he encontrado con algo que relativamente parecía sencillo pero no se ...
  #1 (permalink)  
Antiguo 06/10/2005, 08:57
Avatar de susaninhax  
Fecha de Ingreso: noviembre-2004
Mensajes: 358
Antigüedad: 19 años, 5 meses
Puntos: 3
capas y suma de valores

Buenas compañeros:

No se mucho de javascript pero bueno estoy en ello, pero me he encontrado con algo que relativamente parecía sencillo pero no se me ocurre como hacerlo. Tengo un formulario con tres cajas de texto para poner tres palabras, y al final de todo tengo un numero(50). Pues bien, mi problema es el siguiente:

Una vez relleno esas tres casillas tengo que pinchar en un sitio(boton, enlace o imagen) y que se me despliegue automáticamente otra capa o celda con otras tres casillas, pero a la vez que pincho en ese sitio tiene que sumar al numero que tengo al final otro numero ya prefijado , ejemplo( 50(que ya tenía) + 50) y me escriba al momento ,sea en una caja de texto o no, el total de esa suma, en este caso 100. No se si me he esplicado correctamente, pero con lo de las capas no tengo muchos problemas al menos por ahora, mi problema viene a la hora de hacer la suma, había pensado en hacer una funcion llamada calcular(); y en el evento onclick de un enlace o en una imagen pues llamar a esa función. Pero no se me ocurre la función como puede ser Si necesitais que lo esplique otra vez o con algun ejemplo no hay problema.

Espero que me podais echar una mano, os estaría muy agradeciad.

Un saludo y muchas gracias de antemano.
  #2 (permalink)  
Antiguo 06/10/2005, 10:34
Avatar de susaninhax  
Fecha de Ingreso: noviembre-2004
Mensajes: 358
Antigüedad: 19 años, 5 meses
Puntos: 3
a lo mejor es mucho lio...

A lo mejor es mucho lío, io creo que con la formulita me basta, es decir, como puedo hacer para ir sumando un valor cada vez que hago click en una imagen y escribiendo el total de la suma por ejemplo en una label.

He intentado ir mas o menos así, pero estoy muy perdida:

(precio es el nombre de la label por ejemplo)

function calcular()
{
precio = document.contrato.cantidad.value
suma = (precio + 50)
document.contrato.precio.value = suma
}

Y luego al hacer click en una imagen por medio del onclick(o el que sea, no controlo mucho) llame a esa función : name="cantidad" onclick="calcular()";

y la suma( el total) aparezca o se escriba al instante en una caja de texto o en la label algo tal que así:
<label id='precio' name='precio'>50</label> o por ejemplo:
<input name="precio" type="precio" class="campo_texto" size="6" value="">

Voy bien encaminada, voy fatalmente encaminada???????? porfabor, una ayudita, o una pista

Muchas gracias de antemano, y un saludo para todos
  #3 (permalink)  
Antiguo 07/10/2005, 01:25
Avatar de susaninhax  
Fecha de Ingreso: noviembre-2004
Mensajes: 358
Antigüedad: 19 años, 5 meses
Puntos: 3
nadie sabe :-(

nadie sabe como hacerlo, ni un poquito???solo necesito saber como hacer que cuando hago click en un enlace o un boton sume 50 a otro valor. ...

Un poquito de porfaborr....

enga, un saludo para tooosss!!!!
  #4 (permalink)  
Antiguo 07/10/2005, 07:51
Avatar de programeitor  
Fecha de Ingreso: febrero-2005
Mensajes: 994
Antigüedad: 19 años, 2 meses
Puntos: 9
mira, tienes dos campos a sumar y el resultado se muestra en el tercer campo al apretar el boton:


<input id="campo1"value="22">
<input id="campo2"value="11">
<input type="button" value="sumar" onclick="
document.getElementById('resultado').value
=
Math.floor(document.getElementById('campo1').value)
+
Math.floor(document.getElementById('campo2').value)
">
<input id="resultado">

  #5 (permalink)  
Antiguo 10/10/2005, 08:54
Avatar de susaninhax  
Fecha de Ingreso: noviembre-2004
Mensajes: 358
Antigüedad: 19 años, 5 meses
Puntos: 3
Gracias por responder:-)

hola a todo el mundo y a programeitor, gracias por reponder, el codigo que me has dado funciona muy bien pero no es lo que busco. pero gracias de todos modos , necesito que cuando presiones en un botón o en un enlace, autmáticamente sume 50 a un valor inicial y lo escriba en una label, como si fuera un texto, y si vuelvo a clicar en un segundo boton, sume otros 50 al resultado de sumar antes 50 mas el valor que tenia inicialmente. y lo vuelva a escribir en la misma label, es decir:

valor inicial=50;
hago click en 1ºenlace= 50 + 50= 100 y en la label escriba 100.
hago click en 2º enlace= 100 + 50= 150 y en la label que antes ponía 100 ahora ponga 150

sin recargarse la págona ni utilizar cajas de texto.... ese es mi gran problema que no se hacerlo sin utilizar cajas de texto y con enlaces....
Se te ocurre algun otro modo????????? un sitio donde lo he visto por eso se que se puede pero cuyo código no entiendo es exactamente:
http://*******.com/servidores_dedica...ervidor=lminiu donde están los asteriscos hay que poner sin espacios: a b a n s y s ,
si le das a añadir servicios adicionales y vas escogiendo pues va sumando los precios y poniendo el resultado en la misma label sin recargar la página. el código que usan es demasiado complejo para mí, he intentado desmenuzarlo, pero no se mucho de javascript y no soi capaz de adaptarlo a lo que yo quiero... A alguien se le ocurre algo??????? porfaborr???

Pues muchas gracias de antemano a todos
  #6 (permalink)  
Antiguo 10/10/2005, 12:41
Avatar de programeitor  
Fecha de Ingreso: febrero-2005
Mensajes: 994
Antigüedad: 19 años, 2 meses
Puntos: 9
He entrado donde dices pero, no he visto forma de escoger nada, y el label del que hablas ,¿a que te refieres?
  #7 (permalink)  
Antiguo 11/10/2005, 01:55
Avatar de susaninhax  
Fecha de Ingreso: noviembre-2004
Mensajes: 358
Antigüedad: 19 años, 5 meses
Puntos: 3
buenos días:-)

Buenos días a todos;

buenas programeitor, si entras en a b a n s y s (sin espacios).com y escojes en el menú servidores, le das a cualquiera de los ejemplos que te vienen ahí en "+información" y vas a una pag donde te describe el servidor que has escojido y tienes un recuadro con texto azul y naranja y te pone en azul "presupuesto online" pues si pinchas ahí entras en un formulario donde una de las opciones es (con una estrellita te lo remarca): » Añada servicios adicionales a su servidor dedicado., si haces click ahí te aparecen nuevos campos(combobox), y según vallas escojiendo en esos combos te va haciendo la suma de los productos autmáticamente y te lo escribe abajo de todo en naranja. jiji espero que me halla esplicado bien, pero vamos, que sí que aparece pues es algo así lo que quiero hacer pero en vez de escojer en combos pues haciendo click en un enlace, o botón o con lo que se pueda

Un saludeteeeeee
  #8 (permalink)  
Antiguo 11/10/2005, 15:28
Avatar de programeitor  
Fecha de Ingreso: febrero-2005
Mensajes: 994
Antigüedad: 19 años, 2 meses
Puntos: 9
Bueno, he retomando la pregunta desde el principio y no vas muy descaminada, el script que has puesto me parece correcto ,esto:
Cita:
<label id='precio' name='precio'>50</label> o por ejemplo:
<input name="precio" type="precio" class="campo_texto" size="6" value="">
deberia ser asi:
<label for="precio" id="precio">50</label>
<input name="precio" type="text" class="campo_texto" size="6" value="">

añadiendo esto para lanzar la funcion:

<input type="button" onclick="calcular">

ahora el script, deberia quedar asi:
<script>
function calcular()
{
precio = document.contrato.cantidad.value
suma = (precio + 50)
document.getElementById('precio').innerHTML= suma
}
</script>

A ver si te vale.
  #9 (permalink)  
Antiguo 13/10/2005, 01:27
Avatar de susaninhax  
Fecha de Ingreso: noviembre-2004
Mensajes: 358
Antigüedad: 19 años, 5 meses
Puntos: 3
suma de un valor al hacer click en un boton.

Nada programeitor, lo acabo de probar, y na no sale jo, he probado a ponerle el boton, y tal como me lo has puesto y nada. Io no se que más se puede intentar. He vuelto a intentar desmenuzar el codigo de la otra pagina, pero es arto dificil para mí , ia que yo de javascript poquito.... si doi avanzado un pelín lo pongo aquí.Has visto finalmente el ejemplo que hay
en a b a n s y s ???Es muy práctico a la hora de hacer formularios ese script, si se pudiera desmenuzar o hacer algo similar.. ains... en fin.

Voy seguir intentando, un saludo y muchas gracias
  #10 (permalink)  
Antiguo 13/10/2005, 14:30
Avatar de programeitor  
Fecha de Ingreso: febrero-2005
Mensajes: 994
Antigüedad: 19 años, 2 meses
Puntos: 9
no se si lo habras visto, me he equivocado aqui:

<input type="button" onclick="calcular">

debe quedar asi:

<input type="button" onclick="calcular()">
  #11 (permalink)  
Antiguo 14/10/2005, 01:24
Avatar de susaninhax  
Fecha de Ingreso: noviembre-2004
Mensajes: 358
Antigüedad: 19 años, 5 meses
Puntos: 3
Buenas otra ves

si me había dado cuenta de que te faltaban los paréntesis, pero no va, lo he puesto exactamente iguál pero no va, no se si es por el botón, o por lo que es, pero no me funciona, ni escribe en la label ni en la text.

que raro verdad? un saludo y muchísimas gracias de veras ante todo.
  #12 (permalink)  
Antiguo 14/10/2005, 03:00
 
Fecha de Ingreso: octubre-2004
Ubicación: España
Mensajes: 894
Antigüedad: 19 años, 6 meses
Puntos: 3
Hola, susaninhax
No me queda del todo claro lo que quieres. ¿Porqué no pones un ejemplo de
código?

Prueba esto:
Código HTML:
<form name="contrato">
Dato inicial:<input name="dato" type="text" size="6" value="25">
<input type="button" onclick="calcular()" value="Sumar 50">
La suma es <span id="suma"></span>
</form>
<script type="text/javascript">
var suma = parseInt(document.contrato.dato.value)
function calcular()
{
suma += 50
document.getElementById('suma').innerHTML = suma
}
</script> 
__________________
Angel :cool:
  #13 (permalink)  
Antiguo 14/10/2005, 04:06
Avatar de susaninhax  
Fecha de Ingreso: noviembre-2004
Mensajes: 358
Antigüedad: 19 años, 5 meses
Puntos: 3
funcionaa:-)

Muchisimas graciassss, funciona muy bien, lo he adaptado para poder llamar a la funciíon desde un enlace, pero sin usar el onclick puesto que lo tengo ocupado , utilizo el onMouseDown creo que se escribe así y funciona muy bien, ahora probaré esto con dos enlaces primero haré clic en uno y que sume y luego haré clic en el segundo enlace y que sume , haber como sale y si funciona lo tengo solucionado, muchisimas gracias a los dos por vuestra ayuda!!! de veras.

Un saludo y ya os cuento que tal fué.
  #14 (permalink)  
Antiguo 14/10/2005, 04:24
Avatar de susaninhax  
Fecha de Ingreso: noviembre-2004
Mensajes: 358
Antigüedad: 19 años, 5 meses
Puntos: 3
Vale ya lo he probado, y funciona de lujo, pero me he dado cuenta de que me falta un detalle, y la verdad no se me ocurre como hacerlo, haber si me podéis ayudar en este último detalle:

El script se me queda algo así:
Código HTML:
<a href="#" onClick="cambio('Tester')" onMouseDown="calcular()">Añadir más</a>

 Precio:<input name="dato" type="text" size="1" value="25">&euro; 
                       
<script type="text/javascript">
var suma = parseInt(document.contrato.dato.value)
function calcular()
{
suma += 25
document.getElementById('suma').innerHTML = suma
}
</script>
El Importe total es de  <span id="suma"></span>€uros
Bien, el script está muy resumido porque es un formulario muy grande y hay mucho campo... entonces, mi pregunta es, hay algún modo para que imprima el valor inicial en la label y que cuando se ejecute calcular() aparezca ya la suma como antes¿??¿?¿
por ejemplo mmm var dato=10; y luego como hago para que aparezca en el importe total dato y que cuando se ejecute calcular aparezca suma... parece un poco complicado no?
Espero que me haya expresado bien, con esto ya finalizaría mi problema, muchísimas gracias de antemano
  #15 (permalink)  
Antiguo 14/10/2005, 12:18
 
Fecha de Ingreso: octubre-2004
Ubicación: España
Mensajes: 894
Antigüedad: 19 años, 6 meses
Puntos: 3
Hola de nuevo. Me alegra que vayas solucionando.
No estoy seguro de si leerá el valor antes de terminar de construir la página, pero intenta esto:
Código HTML:
<a href="#" onClick="cambio('Tester')" onMouseDown="calcular()">Añadir más</a>

 Precio:<input name="dato" type="text" size="1" value="25">&euro; 
El Importe total es de  <span id="suma"></span>€uros
                       
<script type="text/javascript">
var suma = parseInt(document.contrato.dato.value)
document.getElementById('suma').innerHTML = suma  //esto es para el valor inicial
function calcular()
{
suma += 25
document.getElementById('suma').innerHTML = suma
}
</script> 
Si no funciona, podrías ponerlo en
Código HTML:
<body onLoad="document.getElementById('suma').innerHTML = document.contrato.dato.value"> 
Por otro lado, puedes ejecutar sin ningún problema las dos funciones en el mismo onClick:
Código HTML:
<a href="#" onClick="calcular(); cambio('Tester')">Añadir más</a> 
__________________
Angel :cool:
  #16 (permalink)  
Antiguo 17/10/2005, 04:46
Avatar de susaninhax  
Fecha de Ingreso: noviembre-2004
Mensajes: 358
Antigüedad: 19 años, 5 meses
Puntos: 3
AISS muchísimas gracias, funciona perfectamente,el script no, pero si con el antiguo script le pongo el onLoad en el body funciona bárbaro!!!!

Ahora quedaría una cosa así:
Código HTML:
En el body...;
<body onLoad="document.getElementById('suma').innerHTML = document.contrato.dato.value">
...
Para que me funcione las capas:
<form action="solicitud_cont.php" method="post"   title="Formulario de posicionamiento" name="contrato"  >  
				
<!--  INICIO de desplegables (submenus)-->
<script language="JavaScript" type="text/JavaScript">
function cambio(cual)
{
if (document.getElementById(cual).style.display == 'none')
document.getElementById(cual).style.display = 'block'
else
document.getElementById(cual).style.display = 'none'
}
</script> 

<input name="criterio1" type="text" class="text" id="criterio1" size="20">
<input name="criterio2" type="text" class="text" id="criterio2" size="20">
<input name="criterio3" type="text" class="text" id="criterio3" size="20">

<a onClick="cambio('Tester')" onMouseDown="calcular()" style="cursor:hand">A&ntilde;adir m&aacute;s</a>
                       
<br>
Precio:	<input name="dato" type="text" size="1" value="25">
<span class="text">&euro;uros cada criterio </span>    
                   
<script type="text/javascript">
var suma = parseInt(document.contrato.dato.value)
function calcular()
{
suma += 25
document.getElementById('suma').innerHTML = suma
}
</script>

    <tr  id="Tester" style="display: none">

 <!--akí hcemos que se despliegue otra fila para poder añadir mas campos y que haga la suma -->
                      <td colspan="3" class="text">
<input name="criterio4" type="text" class="text" id="criterio4" size="20">
<input name="criterio5" type="text" class="text" id="criterio5" size="20">
<input name="criterio6" type="text" class="text" id="criterio6" size="20">

<a onClick="cambio('Tester2')" onMouseDown="calcular()" style="cursor:hand"><span class="texto_negro">A&ntilde;adir m&aacute;s</span></a> </td>
                    </tr>
//AKÍ aparece el importe total de la suma
El Importe total es de  <span id="suma"></span>€uros
Bueno no se si se entiende muy bien lo que acabo de poner espero que sí, ya que no puedo ver como queda con los colores ahora. Es que tengo un formulario muy grande como para copiarlo todo, Alo mejro a alguien le sirve esto que estamos haciendo , así que si alguien necesitara el codigo entero para verlo visual me mandais un privado y ya está.

Por otra parte, una vez lo veo funcionando me doi cuenta de que necesito mas ajustessss ya que con lo torpe que soi no me dí cuenta de una cosa:

relleno tres campos y le doi al enlace, por lo tanto se me despliega otra fila con tres campos más y a la vez se ejecuta nuestro script de la suma, sumando 25 al valor inicial y lo escribe en la label. Hasta ahí todo fenómeno, pero luego si vuelvo a clicar en el enlace para eliminar esa fila porque no me enteresa y la quiero ocultar, el script vuelve a sumar otros 25 al resultado, y claro dejaría de ser un precio exacto, vamos que lo que le falta por hacer es que si clico una vez en ese enlace sume 25, pero si vuelvo a clicar en ese mismo enlace me reste esos 25 que acabo de sumar. He pensado que a lo mejor se puede jugar con el script de las capas, que si está visible sume 25 y si está oculto pues reste 25. El script de las capas es:

Código HTML:
<script language="JavaScript" type="text/JavaScript">
function cambio(cual)
{
if (document.getElementById(cual).style.display == 'none')
document.getElementById(cual).style.display = 'block'
else
document.getElementById(cual).style.display = 'none'
}
</script> 
Menudo porron que estoy escribiendo... solo espero que sirva de algo y para alguien, yo ovbiamente necesito hacer esto, pero madre mía, no se si es mucho lo que estoy pidiendo, pero si se os ocurre algún modo pues os estaría muy agradecida la verdad.
Pues eso, muchas gracias angsanchez, me ha sido genial, pero si sabes como podría encaminar o hacer lo de restar 25 sería una triunfada, Muchísimas gracias de ante mano, y saludossss:
  #17 (permalink)  
Antiguo 24/10/2005, 02:19
Avatar de susaninhax  
Fecha de Ingreso: noviembre-2004
Mensajes: 358
Antigüedad: 19 años, 5 meses
Puntos: 3
sigo bastante bloqueada, he probado a jugar con las capas, es decir si está visible o no, pero no he conseguido nada, a alguien se le ocurre como puedo solucionarlo?¿?¿

Muchas gracias de antemano
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 01:34.