Foros del Web » Programando para Internet » Javascript »

como leer text select option y sumar con input

Estas en el tema de como leer text select option y sumar con input en el foro de Javascript en Foros del Web. buenas tardes amigos, estoy teniendo problemas con un script, ya he buscado por la red y no he encontrada nada parecido. estoy tratando que cuando ...
  #1 (permalink)  
Antiguo 13/11/2011, 07:51
Avatar de arcanisgk122  
Fecha de Ingreso: junio-2010
Mensajes: 755
Antigüedad: 13 años, 10 meses
Puntos: 28
como leer text select option y sumar con input

buenas tardes amigos, estoy teniendo problemas con un script, ya he buscado por la red y no he encontrada nada parecido.

estoy tratando que cuando el usuario selecciones una opcion del select option automáticamente en un imput text aparezca un contador, dicho contador lleva la suma de puntos que el usuario va acumulando. el problema es que el value del select option esta usado en un script y el valor que en realidad necesito que sume o reste esta en el text del option el cual va de -50 a 200.

[COLOR="rgb(139, 0, 0)"]les dejo el script:[/COLOR]

Código PHP:
            var point=0;
            function 
statpoint(){
            var 
pointset document.getElementById("pfrs");
            var 
pointop1 parseInt(pointset.options[pointset.selectedIndex].text);
            var 
atrset document.getElementById("atr");
            var 
atrpoint atrset.options[atrset.selectedIndex].value;
            
                switch (
"pointop1"){
                    case 
"-50":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                    case 
"-40":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                    case 
"-30":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                    case 
"-20":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    case 
"-10":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                    case 
"0":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                    case 
"10":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                    case 
"20":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                    case 
"30":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                    case 
"45":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                    case 
"60":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                    case 
"80":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                    case 
"100":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                    case 
"125":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                    case 
"150":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                    case 
"200":
                        
point=atrpoint+pointop1;
                        
atrpoint point;
                    break;
                }
            
document.form1.atr.text atrpoint;
            } 

[COLOR="rgb(139, 0, 0)"]ak les dejo los html[/COLOR]


Código HTML:
<select id="pfrs" name="pfrs" size="1" onchange="calcula1(this.options.selectedIndex);statpoint(this.options.selectedIndex.text)">
	<option value="5">-50</option>
	<option value="6">-40</option>
	<option value="7">-30</option>
	<option value="8">-20</option>
	<option value="9">-10</option>
	<option value="10" selected="selected">0</option>
	<option value="11">10</option>
	<option value="12">20</option>
	<option value="13">30</option>
	<option value="14">45</option>
	<option value="15">60</option>
	<option value="16">80</option>
	<option value="17">100</option>
	<option value="18">125</option>
	<option value="19">150</option>
	<option value="20">200</option>
</select> 

y el input:


Código HTML:
<input name="atr" id="atr" value="0" readonly="readonly" /> 
__________________
Cooler Master Gladiator 600 - AMD PHENOM II X4 955 @ 3.5GHZ
GA-MA78GM-US2H - Super Talent 800 2GB x 2 Dual, (Unganged)
PSU Cooler Master eXtreme Power Plus 500W - Saphire R7-260OC-2GB
  #2 (permalink)  
Antiguo 13/11/2011, 13:49
 
Fecha de Ingreso: julio-2011
Mensajes: 220
Antigüedad: 12 años, 9 meses
Puntos: 72
Respuesta: como leer text select option y sumar con input

En realidad no es necesario utilizar switch en la función statpoint(), tampoco se necesita pasar el parámetro cuando se llama a esta ya que no lo esta recibiendo. Solo hay que recuperar el valor del texto de cada <option> convertirlo a número con parseInt(), lo cual ya se esta haciendo, recuperar el valor actual del campo <input> convertirlo a número tambien y por último sumar estos valores y asignarlos al mismo campo de texto <input>. La función puede servir de esta manera.

Código Javascript:
Ver original
  1. function statpoint(){
  2.             var pointset = document.getElementById("pfrs");
  3.             var pointop1 = parseInt(pointset.options[pointset.selectedIndex].text);
  4.             var atrset = document.getElementById("atr");
  5.             var atrpoint= parseInt(atrset.value);
  6.             atrset.value= atrpoint + pointop1;
  7.             }

Y el llamado en onchange se hace sin parametros.

Código Javascript:
Ver original
  1. <select id="pfrs" name="pfrs" size="1" onchange="calcula1(this.options.selectedIndex);statpoint()">
  #3 (permalink)  
Antiguo 13/11/2011, 20:51
Avatar de arcanisgk122  
Fecha de Ingreso: junio-2010
Mensajes: 755
Antigüedad: 13 años, 10 meses
Puntos: 28
Respuesta: como leer text select option y sumar con input

el caso es que tengo en realidad 4 select options... con datos parecidos, igual lo probare dejo comentarios de resultados. estuve revisando y pues si hace lo que debe hacer el script pero no del modo que debería de ser correcto explico:

digamos que el select esta en 0 el usuario escoge -50 perfecto en el imput aparece -50,
el problema esta cuando el usuario decide que no esta bien -50 y decide tomar otro valor por ejemplo -40 en el imput debería de aparecer -40 pero no es así lo que hace es que lo suma con el anterior valor y termina saliendo un -90 en el input, puedo destacar que esta bien para funcionar con los 4 selec y al final los 4 deberían de ser sumados... pero a la hora de que el usuario cambie la selección el script pierde lógica.... a ver alguien me puede apoyar.

existe alguna forma de, leer el valor actual que tiene el select, antes de que el usuario lo cambie, así se tomaría primero el valor que tiene el select se restaría y luego de esto se le sumaria el valor nuevo seleccionado por el usuario. se que debe de hacer el script pero ni idea de como entrarle al código.
__________________
Cooler Master Gladiator 600 - AMD PHENOM II X4 955 @ 3.5GHZ
GA-MA78GM-US2H - Super Talent 800 2GB x 2 Dual, (Unganged)
PSU Cooler Master eXtreme Power Plus 500W - Saphire R7-260OC-2GB

Última edición por arcanisgk122; 13/11/2011 a las 21:50
  #4 (permalink)  
Antiguo 14/11/2011, 10:12
Avatar de arcanisgk122  
Fecha de Ingreso: junio-2010
Mensajes: 755
Antigüedad: 13 años, 10 meses
Puntos: 28
Respuesta: como leer text select option y sumar con input

agradezco comentario he ideas...todo es bienvenido.
__________________
Cooler Master Gladiator 600 - AMD PHENOM II X4 955 @ 3.5GHZ
GA-MA78GM-US2H - Super Talent 800 2GB x 2 Dual, (Unganged)
PSU Cooler Master eXtreme Power Plus 500W - Saphire R7-260OC-2GB
  #5 (permalink)  
Antiguo 14/11/2011, 17:18
 
Fecha de Ingreso: julio-2011
Mensajes: 220
Antigüedad: 12 años, 9 meses
Puntos: 72
Respuesta: como leer text select option y sumar con input

Hola, se me ocurre que se puede guardar, en una variable global, el valor del select cada vez que se de el evento onchange, de esa manera se podria saber el valor anterior al cambio. La variable se inicializaria con un valor de 0 ya que la primera vez que se seleccione un valor del select no habra alguno anterior, luego se toma el valor contenido en esta variable global y se realizan las operaciones y asignaciones necesaria y al final se guarda el nuevo valor seleccionado en la variable global, de esta forma estara disponible para es siguiente evento onchange.
  #6 (permalink)  
Antiguo 14/11/2011, 17:27
Avatar de arcanisgk122  
Fecha de Ingreso: junio-2010
Mensajes: 755
Antigüedad: 13 años, 10 meses
Puntos: 28
Respuesta: como leer text select option y sumar con input

y como se manejaría la variable global no se si me doy a entender que esto esta amarrado a que son 4 select options
__________________
Cooler Master Gladiator 600 - AMD PHENOM II X4 955 @ 3.5GHZ
GA-MA78GM-US2H - Super Talent 800 2GB x 2 Dual, (Unganged)
PSU Cooler Master eXtreme Power Plus 500W - Saphire R7-260OC-2GB
  #7 (permalink)  
Antiguo 14/11/2011, 17:30
 
Fecha de Ingreso: julio-2011
Mensajes: 220
Antigüedad: 12 años, 9 meses
Puntos: 72
Respuesta: como leer text select option y sumar con input

Bueno, se puede tener una variable global por cada <select>.
  #8 (permalink)  
Antiguo 14/11/2011, 17:32
Avatar de arcanisgk122  
Fecha de Ingreso: junio-2010
Mensajes: 755
Antigüedad: 13 años, 10 meses
Puntos: 28
Respuesta: como leer text select option y sumar con input

tienes algún ejemplo?
__________________
Cooler Master Gladiator 600 - AMD PHENOM II X4 955 @ 3.5GHZ
GA-MA78GM-US2H - Super Talent 800 2GB x 2 Dual, (Unganged)
PSU Cooler Master eXtreme Power Plus 500W - Saphire R7-260OC-2GB
  #9 (permalink)  
Antiguo 14/11/2011, 18:14
 
Fecha de Ingreso: julio-2011
Mensajes: 220
Antigüedad: 12 años, 9 meses
Puntos: 72
Respuesta: como leer text select option y sumar con input

Prueba esto.

Código Javascript:
Ver original
  1. <script>
  2. var globales= new Array(0, 0, 0, 0);
  3.  
  4. function statpoint(elemSelect, indiceArray)
  5. {
  6.   var textoActualSeleccionado= parseInt(elemSelect.options[elemSelect.selectedIndex].text);
  7.   var textoAnterior= globales[indiceArray];
  8.   alert("El texto anterior seleccionado es: "+ globales[indiceArray] +"\n El actual texto seleccionado es: "+ textoActualSeleccionado);
  9.   globales[indiceArray]= textoActualSeleccionado;
  10.   alert("Se ha cambiado el valor guardado en el Array global ahora es: "+ globales[indiceArray]);
  11. }
  12. </script>
  13.  
  14. <select id="pfrs" name="pfrs" size="1" onchange="statpoint(this, 0)">
  15.     <option value="5">-501</option>
  16.     <option value="6">-401</option>
  17.     <option value="7">-301</option>
  18.     <option value="8">-201</option>
  19.     <option value="9">-101</option>
  20.     <option value="10" selected="selected">0</option>
  21.     <option value="11">101</option>
  22.     <option value="12">201</option>
  23.     <option value="13">301</option>
  24.     <option value="14">451</option>
  25.     <option value="15">601</option>
  26.     <option value="16">801</option>
  27.     <option value="17">1001</option>
  28.     <option value="18">1251</option>
  29.     <option value="19">1501</option>
  30.     <option value="20">200</option>
  31. </select>
  32. <select id="pfrs" name="pfrs" size="1" onchange="statpoint(this, 1)">
  33.     <option value="5">-502</option>
  34.     <option value="6">-402</option>
  35.     <option value="7">-302</option>
  36.     <option value="8">-202</option>
  37.     <option value="9">-102</option>
  38.     <option value="10" selected="selected">0</option>
  39.     <option value="11">102</option>
  40.     <option value="12">202</option>
  41.     <option value="13">302</option>
  42.     <option value="14">452</option>
  43.     <option value="15">602</option>
  44.     <option value="16">802</option>
  45.     <option value="17">1002</option>
  46.     <option value="18">1252</option>
  47.     <option value="19">1502</option>
  48.     <option value="20">2002</option>
  49. </select>
  50. <select id="pfrs" name="pfrs" size="1" onchange="statpoint(this, 2)">
  51.     <option value="5">-503</option>
  52.     <option value="6">-403</option>
  53.     <option value="7">-303</option>
  54.     <option value="8">-203</option>
  55.     <option value="9">-103</option>
  56.     <option value="10" selected="selected">0</option>
  57.     <option value="11">101</option>
  58.     <option value="12">203</option>
  59.     <option value="13">303</option>
  60.     <option value="14">453</option>
  61.     <option value="15">603</option>
  62.     <option value="16">803</option>
  63.     <option value="17">1003</option>
  64.     <option value="18">1253</option>
  65.     <option value="19">1503</option>
  66.     <option value="20">2003</option>
  67. </select>
  68. <select id="pfrs" name="pfrs" size="1" onchange="statpoint(this, 3)">
  69.     <option value="5">-504</option>
  70.     <option value="6">-404</option>
  71.     <option value="7">-304</option>
  72.     <option value="8">-204</option>
  73.     <option value="9">-104</option>
  74.     <option value="10" selected="selected">0</option>
  75.     <option value="11">104</option>
  76.     <option value="12">204</option>
  77.     <option value="13">304</option>
  78.     <option value="14">454</option>
  79.     <option value="15">604</option>
  80.     <option value="16">804</option>
  81.     <option value="17">1004</option>
  82.     <option value="18">1254</option>
  83.     <option value="19">1504</option>
  84.     <option value="20">2004</option>
  85. </select>

Los valores globales se almacenan en un Array, se utiliza una posición de este para cada <select>. La función recibe dos parametros uno es la palabra clave this y el otro el número que indica el indice del Array en el que se guarda el valor. En este ejemplo la función solo recupera el texto seleccionado y el valor guardado en el Array, muestra ambos en un alert y despues cambia el valor en el Array y muestra este en otro alert.
Espero que esto te sirva de algo, un saludo.
  #10 (permalink)  
Antiguo 14/11/2011, 21:20
Avatar de arcanisgk122  
Fecha de Ingreso: junio-2010
Mensajes: 755
Antigüedad: 13 años, 10 meses
Puntos: 28
Respuesta: como leer text select option y sumar con input

muchas gracias en un rato actualiso como resolvi y si me ayudo de mucho gracias
__________________
Cooler Master Gladiator 600 - AMD PHENOM II X4 955 @ 3.5GHZ
GA-MA78GM-US2H - Super Talent 800 2GB x 2 Dual, (Unganged)
PSU Cooler Master eXtreme Power Plus 500W - Saphire R7-260OC-2GB
  #11 (permalink)  
Antiguo 15/11/2011, 22:09
Avatar de arcanisgk122  
Fecha de Ingreso: junio-2010
Mensajes: 755
Antigüedad: 13 años, 10 meses
Puntos: 28
Respuesta: como leer text select option y sumar con input

lo he reducido hasta llegar a esto pero aun asi no me funciona:


Código Javascript:
Ver original
  1. function calcula(dat1, dat2){
  2.             var ope = dat1.options[dat1.selectedIndex].value
  3.             document.form1.dat2.value = ope;
  4.             document.form1.pfrs.disabled=this.value!='';
  5.             }

y la llamada la hago:

Código HTML:
Ver original
  1. onchange="calcula(this.options.selectedIndex,'des')"
__________________
Cooler Master Gladiator 600 - AMD PHENOM II X4 955 @ 3.5GHZ
GA-MA78GM-US2H - Super Talent 800 2GB x 2 Dual, (Unganged)
PSU Cooler Master eXtreme Power Plus 500W - Saphire R7-260OC-2GB

Etiquetas: calculadora, html, input, option, select, suma, sumador, switch, txt
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 20:41.