Foros del Web » Programando para Internet » Javascript »

Sumar tiempos en un Text Dinamicamente

 Estas en el tema de Sumar tiempos en un Text Dinamicamente en el foro de Javascript en Foros del Web. Buenas amigos del foro tengo una duda y me gustaría que me guiaran... tengo 3 textos (son mas en realidad ) donde con una mascara ...
  #1 (permalink)  
Antiguo 16/10/2012, 10:29
Avatar de JuJoGuAl  
Fecha de Ingreso: julio-2009
Ubicación: Venezuela
Mensajes: 754
Antigüedad: 15 años, 7 meses
Puntos: 19
Pregunta Sumar tiempos en un Text Dinamicamente
Buenas amigos del foro tengo una duda y me gustaría que me guiaran...

tengo 3 textos (son mas en realidad ) donde con una mascara e definido que los datos sean colocados (00:00:00) para representar tiempos de demora de una acción, ahora necesito que un textbox en particular tenga la suma de esos 3 textos de forma dinámica, es decir a medida que voy ingresando los tiempos el resultado se vaya reflejando...

Me perdí en el proceso porque estoy sumando tiempos con una mascara ya definida, y nose como sumarlos en un text al final

Alguien que me guíe por favor?
  #2 (permalink)  
Antiguo 16/10/2012, 10:38
 
Fecha de Ingreso: agosto-2011
Ubicación: Santo Domingo
Mensajes: 487
Antigüedad: 13 años, 7 meses
Puntos: 31
Respuesta: Sumar tiempos en un Text Dinamicamente
desenmascaralo, sumalos y vuelve a ponerle la mascara... supongo
__________________
El talento se educa en la KARMA y el carácter en la tempestad.
Gabriel De Los Santos
  #3 (permalink)  
Antiguo 16/10/2012, 10:40
Avatar de JuJoGuAl  
Fecha de Ingreso: julio-2009
Ubicación: Venezuela
Mensajes: 754
Antigüedad: 15 años, 7 meses
Puntos: 19
Respuesta: Sumar tiempos en un Text Dinamicamente
pero son tiempos no puedo obligar al cliente a colocar solos los seg, el requerimiento es que ingresen los tiempos en el formato 00:00:00 y que un text muestre el resultado de las sumas de los tiempos
  #4 (permalink)  
Antiguo 16/10/2012, 10:42
 
Fecha de Ingreso: agosto-2011
Ubicación: Santo Domingo
Mensajes: 487
Antigüedad: 13 años, 7 meses
Puntos: 31
Respuesta: Sumar tiempos en un Text Dinamicamente
Pues entonces te recomiendo usar JQuery o Java Script
__________________
El talento se educa en la KARMA y el carácter en la tempestad.
Gabriel De Los Santos
  #5 (permalink)  
Antiguo 16/10/2012, 10:47
Avatar de JuJoGuAl  
Fecha de Ingreso: julio-2009
Ubicación: Venezuela
Mensajes: 754
Antigüedad: 15 años, 7 meses
Puntos: 19
Respuesta: Sumar tiempos en un Text Dinamicamente
Cita:
Iniciado por gldelossantos Ver Mensaje
Pues entonces te recomiendo usar JQuery o Java Script
y si estoy preguntando es porque no conozco el método para hacerlo, soy una de las personas que dice que si en un foro no conoces la respuesta no escribas, y no es por ser mal educado si no que no has dado aporte alguno a la duda que estoy presentando...

Pero gracias por tomarte el tiempo de leer
  #6 (permalink)  
Antiguo 16/10/2012, 10:50
 
Fecha de Ingreso: agosto-2011
Ubicación: Santo Domingo
Mensajes: 487
Antigüedad: 13 años, 7 meses
Puntos: 31
Respuesta: Sumar tiempos en un Text Dinamicamente
Cita:
Iniciado por JuJoGuAl Ver Mensaje
y si estoy preguntando es porque no conozco el método para hacerlo, soy una de las personas que dice que si en un foro no conoces la respuesta no escribas, y no es por ser mal educado si no que no has dado aporte alguno a la duda que estoy presentando...

Pero gracias por tomarte el tiempo de leer

Muchas personas simplemente no tienen la logica exacta.. Pero que mas da..

Le pongo un ejemplo de como hacer con Jquery


Código HTML: 
Ver original
  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head>
  3. <title>Suma</title>
  4. <script type="text/javascript"
  5. src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.min.js">
  6. </script>
  7. <script type="text/javascript">
  8. $(function() {
  9. $("#addAll").click(function() {
  10. var add = 0;
  11. $(".amt").each(function() {
  12. add += Number($(this).val());
  13. });
  14. $("#para").text("Suma total es: " + add);
  15. });
  16. });
  17. </script>
  18. </head>
  19. <body>
  20. <input id="Text1" class="amt" type="text" /><br />
  21. <input id="Text2" class="amt" type="text" /><br />
  22. <input id="Text3" class="amt" type="text" /><br />
  23. <input id="addAll" type="button" value="Suma" /><br />
  24. <p id="para" />
  25. </body>
  26. </html>
__________________
El talento se educa en la KARMA y el carácter en la tempestad.
Gabriel De Los Santos
  #7 (permalink)  
Antiguo 16/10/2012, 10:54
Avatar de JuJoGuAl  
Fecha de Ingreso: julio-2009
Ubicación: Venezuela
Mensajes: 754
Antigüedad: 15 años, 7 meses
Puntos: 19
Respuesta: Sumar tiempos en un Text Dinamicamente
Te explico mi Script para sumar es este:
Código Javascript: 
Ver original
  1. <script language="javascript" type="text/javascript">
  2. var total = 0;
  3. function sumacampos(grupo,resultado)
  4. {
  5.     var suma = 0;   
  6.     for(var i=0, campos = document.getElementsByName(grupo); i < campos.length; i++)
  7.     {
  8.     //Recorro el vector de los campos y realizo la suma
  9.     total = suma;
  10.     suma += parseFloat(campos[i].value);
  11.     if (isNaN(suma)) suma = total;
  12.     }
  13.     //Asigno la suma a un label que ira cambiando de acuerdo a la cantidad que se capture
  14.     document.getElementById(resultado).value = suma;
  15. }
  16. </script>

y los campos que tengo para sumar son:
Código HTML: 
Ver original
  1. <td align="center"><input type="text" name="tiempotefact1" id="tiempotefact1" onkeypress="return acceptNum(event)" maxlength="10" /></td>
  2.             <td align="center"><input type="text" name="TiempoaSumar" id="tiempo11" onkeyup="mascara(this,':',patron,true); sumacampos(this.name,tiempototal1)" maxlength="8" /></td>
  3.             <td align="center"><input type="text" name="TiempoaSumar" id="tiempo12" onkeyup="mascara(this,':',patron,true; sumacampos(this.name,tiempototal1))" maxlength="8" /></td>
  4.             <td align="center"><input type="text" name="TiempoaSumar" id="tiempo13" onkeyup="mascara(this,':',patron,true); sumacampos(this.name,tiempototal1)" maxlength="8" /></td>

y el resultado debo de mostrarlo aqui:

Código HTML: 
Ver original
  1. <td align="center"><input name="tiempotetotal1" type="text" id="tiempototal1" readonly="readonly" /></td>

pero obtengo un error en el navegador de:
- Uncaught TypeError: Cannot set property 'value' of null mediciones.php:20
- Uncaught SyntaxError: Unexpected token ;
  #8 (permalink)  
Antiguo 16/10/2012, 10:56
 
Fecha de Ingreso: agosto-2011
Ubicación: Santo Domingo
Mensajes: 487
Antigüedad: 13 años, 7 meses
Puntos: 31
Respuesta: Sumar tiempos en un Text Dinamicamente
y tu archivo mediciones.php cual es? postea el codigo
__________________
El talento se educa en la KARMA y el carácter en la tempestad.
Gabriel De Los Santos
  #9 (permalink)  
Antiguo 16/10/2012, 10:58
Avatar de JuJoGuAl  
Fecha de Ingreso: julio-2009
Ubicación: Venezuela
Mensajes: 754
Antigüedad: 15 años, 7 meses
Puntos: 19
Respuesta: Sumar tiempos en un Text Dinamicamente
La linea 20 es esta:
Código Javascript: 
Ver original
  1. document.getElementById(resultado).value = suma;

el archivo es grande y no me deja por la cantidad de textos que tiene...

pero si ayuda aca tengo el script de mascara

Código Javascript: 
Ver original
  1. <script language="javascript">
  2. <!--
  3. var patron = new Array(2,2,2)
  4. function mascara(d,sep,pat,nums){
  5. if(d.valant != d.value){
  6.     val = d.value
  7.     largo = val.length
  8.     val = val.split(sep)
  9.     val2 = ''
  10.     for(r=0;r<val.length;r++){
  11.         val2 += val[r]  
  12.     }
  13.     if(nums){
  14.         for(z=0;z<val2.length;z++){
  15.             if(isNaN(val2.charAt(z))){
  16.                 letra = new RegExp(val2.charAt(z),"g")
  17.                 val2 = val2.replace(letra,"")
  18.             }
  19.         }
  20.     }
  21.     val = ''
  22.     val3 = new Array()
  23.     for(s=0; s<pat.length; s++){
  24.         val3[s] = val2.substring(0,pat[s])
  25.         val2 = val2.substr(pat[s])
  26.     }
  27.     for(q=0;q<val3.length; q++){
  28.         if(q ==0){
  29.             val = val3[q]
  30.         }
  31.         else{
  32.             if(val3[q] != ""){
  33.                 val += sep + val3[q]
  34.                 }
  35.         }
  36.     }
  37.     d.value = val
  38.     d.valant = val
  39.     }
  40. }
  41. //-->
  42. </script>
  #10 (permalink)  
Antiguo 16/10/2012, 11:34
Avatar de JuJoGuAl  
Fecha de Ingreso: julio-2009
Ubicación: Venezuela
Mensajes: 754
Antigüedad: 15 años, 7 meses
Puntos: 19
Respuesta: Sumar tiempos en un Text Dinamicamente
ok encontre esta funcion:
Código Javascript: 
Ver original
  1. <script language="javascript">
  2. <!--
  3. function calcular(f){
  4.     horas1=f['tiempo11'].value.split(":");
  5.     horas2=f['tiempo12'].value.split(":");
  6.     horas3=f['tiempo13'].value.split(":");
  7.     horatotale=new Array();
  8.     for(a=0;a<3;a++){
  9.         horas1[a]=(isNaN(parseInt(horas1[a])))?0:parseInt(horas1[a])
  10.         horas2[a]=(isNaN(parseInt(horas2[a])))?0:parseInt(horas2[a])
  11.         horas3[a]=(isNaN(parseInt(horas3[a])))?0:parseInt(horas3[a])
  12.         horatotale[a]=(horas1[a]+horas2[a]+horas3[a]);
  13.     }
  14.     tiempototal1=new Date()
  15.     tiempototal1.setHours(horatotale[0]);
  16.     tiempototal1.setMinutes(horatotale[1]);
  17.     tiempototal1.setSeconds(horatotale[2]);
  18.     
  19.     f['tiempototal1'].value=tiempototal1.getHours()+":"+tiempototal1.getMinutes()+":"+tiempototal1.getSeconds();
  20. }
  21. //-->
  22. </script>

y el html
Código HTML: 
Ver original
  1. <td align="center"><input type="text" name="tiempotefact1" id="tiempotefact1" onkeypress="return acceptNum(event)" maxlength="10" /></td>
  2.             <td align="center"><input type="text" name="TiempoaSumar" id="tiempo11" onblur="calcular(this.form)" onkeyup="mascara(this,':',patron,true)" maxlength="8" /></td>
  3.             <td align="center"><input type="text" name="TiempoaSumar" id="tiempo12" onblur="calcular(this.form)" onkeyup="mascara(this,':',patron,true)" maxlength="8" /></td>
  4.             <td align="center"><input type="text" name="TiempoaSumar" id="tiempo13" onblur="calcular(this.form)" onkeyup="mascara(this,':',patron,true)" maxlength="8" /></td>

el problema que tengo es que son alrededor de 12 campos entonces tenre que crear 4 funciones? busco una manera de pasar por parametro el ID del txt a sumar y el text donde mostrara el resultado...
  #11 (permalink)  
Antiguo 17/10/2012, 08:48
Avatar de JuJoGuAl  
Fecha de Ingreso: julio-2009
Ubicación: Venezuela
Mensajes: 754
Antigüedad: 15 años, 7 meses
Puntos: 19
Respuesta: Sumar tiempos en un Text Dinamicamente
Listo e Solucionado mi duda posteare el código por si alguien lo necesita:

Con este código no solo sumo las horas si no las redondeo (en caso de sumar 00:50:00 + 00:30:00), ademas agregue una opción personal que si la hora es mayor a 1 no dejarla pasar
Código Javascript: 
Ver original
  1. <script>
  2. function calcular(elemento1,elemento2,elemento3,resultado,obj) {
  3.     horas1=document.getElementById(elemento1).value.split(":");
  4.     horas2=document.getElementById(elemento2).value.split(":");
  5.     horas3=document.getElementById(elemento3).value.split(":");
  6.     horatotale=new Array();
  7.     for(a=0;a<3;a++){
  8.         horas1[a]=(isNaN(parseInt(horas1[a])))?0:parseInt(horas1[a])
  9.         horas2[a]=(isNaN(parseInt(horas2[a])))?0:parseInt(horas2[a])
  10.         horas3[a]=(isNaN(parseInt(horas3[a])))?0:parseInt(horas3[a])
  11.         horatotale[a]=(horas1[a]+horas2[a]+horas3[a]);
  12.     }
  13.     tiempototal1=new Date()
  14.     tiempototal1.setHours(horatotale[0]);
  15.     tiempototal1.setMinutes(horatotale[1]);
  16.     tiempototal1.setSeconds(horatotale[2]);
  17.     function completCeros(x,n) {
  18.         x = x.toString();
  19.         while( x.length < n )
  20.             x = "0"+x;
  21.         return x;
  22.     }
  23.     // Creo una variable para capturar los resultados
  24.     var hora=tiempototal1.getHours();
  25.     var minu=tiempototal1.getMinutes();
  26.     var seco=tiempototal1.getSeconds();
  27.     //Completo con '0' si el resultado tiene 1 digito
  28.     hora=completCeros(hora, 2);
  29.     minu=completCeros(minu, 2);
  30.     seco=completCeros(seco, 2);
  31.     //Valido si la hora fue mayor a 1, de ser asi no lo dejo pasar
  32.     if (hora>1)
  33.     {
  34.         alert ('La hora no puede ser mayor a 1 Hora');
  35.         document.getElementById(obj).value='';
  36.         document.getElementById(obj).focus();
  37.     }
  38.     else
  39.     {
  40.         document.getElementById(resultado).value=hora+":"+minu+":"+seco;
  41.     }   
  42. }
  43. </script>

y aqui los campos:
Código HTML: 
Ver original
  1. <tr>
  2.             <td align="center"><input type="text" name="tiempotefact1" id="tiempotefact1" onkeypress="return acceptNum(event)" maxlength="10" /></td>
  3. <td align="center"><input type="text" name="TiempoaSumar" id="tiempo11" onblur="calcular('tiempo11','tiempo12','tiempo13','tiempototal1',this.id)" onkeyup="mascara(this,':',patron,true)" maxlength="8" /></td>
  4.             <td align="center"><input type="text" name="TiempoaSumar" id="tiempo12" onblur="calcular('tiempo11','tiempo12','tiempo13','tiempototal1',this.id)" onkeyup="mascara(this,':',patron,true)" maxlength="8" /></td>
  5.             <td align="center"><input type="text" name="TiempoaSumar" id="tiempo13" onblur="calcular('tiempo11','tiempo12','tiempo13','tiempototal1',this.id)" onkeyup="mascara(this,':',patron,true)" maxlength="8" /></td>
  6.             <td align="center"><input name="tiempotetotal1" type="text" id="tiempototal1" readonly="readonly" /></td>
  7.           </tr>

Espero le sirva a alguien mas :)

Etiquetas: dinamicamente, 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


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 15:19.