Foros del Web » Programando para Internet » Javascript »

suma php y javascript

Estas en el tema de suma php y javascript en el foro de Javascript en Foros del Web. buenas tardes me gustaria que me pudieran colaborar con una suma en javascript ya que he buscado en varios foros pero no se me a ...
  #1 (permalink)  
Antiguo 09/11/2011, 11:13
 
Fecha de Ingreso: noviembre-2011
Ubicación: bogota
Mensajes: 9
Antigüedad: 13 años
Puntos: 0
Pregunta suma php y javascript

buenas tardes me gustaria que me pudieran colaborar con una suma en javascript ya que he buscado en varios foros pero no se me a posible encontrar nada les agredesco mucho de antemano ya que no soy muy experta en javascript

aqui tengo un inicio de sesion
Código Javascript:
Ver original
  1. <script language="javascript">
  2.  
  3. function abrirCaja()
  4. {
  5. posx=((screen.availWidth-320)/2)
  6. posy=((screen.availHeight-200)/2)
  7. eval("boxwindow=window.open('ticket.php','boxwindow','width=320,height=400,toolbar=0,directories=0,status=0,scrollbars=0,resize=0,menubar=0,screenx="+posx+",screeny="+posy+",left="+posx+",top="+posy+"')")
  8. }
  9.  
  10. </script>

aqui tengo una suma ;
Código Javascript:
Ver original
  1. <script language="javascript">
  2. function Sumar(){  
  3.       interval = setInterval("calcular()",1);
  4. }  
  5. function calcular(){  
  6.       uno = document.autoSumForm.valor.value;  
  7.      dos = document.autoSumForm.comision.value;    
  8.      document.autoSumForm.valortotal.value = (uno*1)+(dos*1);  
  9. }  
  10. function NoSumar(){  
  11.      clearInterval(interval);  
  12. } </script>

y mi tabla
Código HTML:
Ver original
  1. <tr>
  2.                 <td width="15%" class="Estilo1"><center>
  3.                   <select name="empresa<?=$i;?>"class="estilo1" id="empresa">
  4.                     <option value="" selected>EMPRESA</option>
  5.                     <option>ACUEDUCTO-ASEO</option>
  6.                     <option>CODENSA</option>
  7.                     <option>COMCEL</option>
  8.                     <option>DIRECT TV</option>
  9.                     <option>ETB</option>
  10.                     <option>GAS NATURAL</option>
  11.                     <option>MOVISTAR</option>
  12.                     <option>SALUD</option>
  13.                     <option>TELMEX</option>
  14.                     <option>TIGO</option>
  15.                     <option>UNE</option>
  16.                    
  17.                   </select></td>
  18.                 <td width="11%" class="Estilo1"><div align="center">
  19.                   <input name="codigo<?=$i;?>" type="text" id="codigo" value="" size="10" maxlength="10" />
  20.                 </div></td>
  21.                 <td class="Estilo1"><div align="center">
  22.                   <input name="fecha<?=$i;?>" type="text" id="fecha" value="" size="20" maxlength="20" />
  23.                 </div></td>
  24.                 <td class="Estilo1"><div align="center">
  25.                   <input  type="text"id="valor" onFocus="Sumar();" onBlur="NoSumar();" name="valor<?=$i;?>" value="" size="15" maxlength="15">
  26.                 </div></td>
  27.                 <td class="Estilo1"><div align="center">
  28.                   <input  type="text" id="comision" onFocus="Sumar();" onBlur="NoSumar();" name="comision<?=$i;?>"  value="" size="15" maxlength="15">
  29.                 </div></td>
  30.                 <td><div align="left" class="Estilo1">
  31.                   <div align="center">
  32.                     <input type="text" class="Estilo6" id="valortotal"  name="valortotal<?=$i;?>"  size="15" maxlength="15" />
  33.                   </div>
  34.                 </div></td>
  35.                 <td>&nbsp;</td>
  36.               </tr>
  37.                 <?
  38.                 }
  39.                 ?>
  40.                 <tr>
  41.                   <td height="37" colspan="8" class="Estilo8">VALOR TOTAL:<?PHP echo $_REQUEST['valortotal<?=$i;?>'] ?></td>
  42.                   </tr>
  43.                 <tr>
  44.                   <td class="Estilo1">&nbsp;</td>
  45.                   <td class="Estilo1">&nbsp;</td>
  46.                 <td height="37" class="Estilo1"><div align="center" class="Estilo1 Estilo2 Estilo1">
  47.                   <input name="Submit" type="submit" class="Estilo6" id="guardar" value="guardar"/>
  48.                   <input type="hidden" name="hdnLine" value="<?=$i;?>">
  49.                 </div></td>

el problema es que quiero hacer incertar mas filas para insentar varias al mismo tiempo a la base de datos y eso lo logre con un codigo de javascript no recuerdo de la autoria de quien
Código Javascript:
Ver original
  1. function MM_jumpMenu(targ,selObj,restore){ //v3.0
  2. eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
  3. if (restore) selObj.selectedIndex=0;
  4. }
el problema es que cuando coloco eso solo me suma una sola casilla ya no suma nada mas ....... alguien me puede ayudar quiero el valor unitario de cada uno mas el valor total seria de mucha ayuda que me pudieran ayudar
  #2 (permalink)  
Antiguo 09/11/2011, 11:17
 
Fecha de Ingreso: noviembre-2011
Ubicación: bogota
Mensajes: 9
Antigüedad: 13 años
Puntos: 0
Respuesta: suma php y javascript

tambien encontre este codigo pero no se como asociar la suma añade columnas y filas y las suma pero yo quiero que mis columnas esten fijas y lo unico que aumente son las filas agradesco mucho que alguien me puede colavorar aqui el lick

http://celucentro.webcindario.com/editartabla.html

y el codigo por si le sirve a alguien

la tabla
Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
  2.   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  3.  
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es">
  5. <title>Editar datos de una tabla</title>
  6. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  7. <link rel="stylesheet" type="text/css" href="editatabla/estilotabla.css" />
  8. <script type="text/javascript" src="editatabla/codigo.js"></script>
  9. </head>
  10. <body onload="iniciarTabla()">
  11. <table id="tabla">
  12. <tr class="cabeza">
  13. <td class="orden">&nbsp;</td><td>&nbsp;</td>
  14. <td>&nbsp;<img src="editatabla/anadir.gif" alt="añadir columna" />&nbsp;<img src="editatabla/menos.gif" alt="borrar columna" /></td>
  15. <td>&nbsp;<img src="editatabla/anadir.gif" alt="añadir columna" />&nbsp;<img src="editatabla/menos.gif" alt="borrar columna" /></td>
  16. <td>&nbsp;</td>
  17. </tr>
  18. <tr class="cabeza">
  19. <td class="orden">&nbsp;</td><td>Ord.</td><td>Cantidad 1</td><td>Cantidad 2</td><td>Total</td>
  20. </tr>
  21. <tr>
  22. <td class="orden">&nbsp;<img src="editatabla/anadir.gif" alt="añadir fila" />&nbsp;<img src="editatabla/menos.gif" alt="borrar fila" /></td><td class="orden">1</td><td>0</td><td>0</td><td>0</td>
  23. </tr>
  24. <tr>
  25. <td class="orden">&nbsp;<img src="editatabla/anadir.gif" alt="añadir fila" />&nbsp;<img src="editatabla/menos.gif" alt="borrar fila" /></td><td class="orden">2</td><td>0</td><td>0</td><td>0</td>
  26. </tr>
  27. <tr>
  28. <td class="orden">&nbsp;</td><td class="orden">ST</td><td>0</td><td>0</td><td>0</td>
  29. </tr>
  30.  
  31.  
  32. </body>
  33. </html>

y el javascript

Código Javascript:
Ver original
  1. /* *******************************************************
  2. ** Código JavaScript para editar los datos de una tabla **
  3. ** JavierB Enero 2007                                   **
  4. *********************************************************/
  5.  
  6. var miTabla = 'tabla'; // poner aquí el id de la tabla que queremos editar
  7.  
  8. // preparar la tabla para edición
  9. function iniciarTabla() {
  10.     tab = document.getElementById(miTabla);
  11.   filas = tab.getElementsByTagName('tr');
  12.   for (i=1; fil = filas[i]; i++) {
  13.     celdas = fil.getElementsByTagName('td');
  14.     for (j=1; cel = celdas[j]; j++) {
  15.       if ((i>0 && j==celdas.length-1) || (i==filas.length-1 && j!=0)) continue; // La última columna  y la última fila no se pueden editar
  16.       cel.onclick = function() {crearInput(this)}
  17.     } // end for j
  18.   } //end for i
  19.  
  20.   // añadir funcion onclick a las imágenes para borrar y añadir y ocultar las imágenes de borrar
  21.   for (i=0; im = document.images[i]; i++)
  22.     if (im.alt=='añadir fila')
  23.       im.onclick = function() {anadir(this,0)}
  24.     else if (im.alt=='añadir columna')  
  25.       im.onclick = function() {anadir(this,1)}
  26.     else if (im.alt=='borrar fila') {
  27.       im.onclick = function() {borrar(this,0)}
  28.       im.style.visibility = 'hidden';
  29.     }
  30.     else if (im.alt=='borrar columna') {
  31.       im.onclick = function() {borrar(this,1)}
  32.       im.style.visibility = 'hidden';
  33.     }  
  34. } // end function
  35.  
  36. // crear input para editar datos
  37. function crearInput(celda) {
  38.   celda.onclick = function() {return false}
  39.   txt = celda.innerHTML;
  40.   celda.innerHTML = '';
  41.   obj = celda.appendChild(document.createElement('input'));
  42.   obj.value = txt;
  43.   obj.focus();
  44.   obj.onblur = function() {
  45.     txt = this.value;
  46.     celda.removeChild(obj);
  47.     celda.innerHTML = txt;
  48.     celda.onclick = function() {crearInput(celda)}
  49.     sumar();    
  50.   }
  51. }
  52.  
  53. // sumar los datos de la tabla
  54. function sumar() {
  55.   tab = document.getElementById(miTabla);
  56.   filas = tab.getElementsByTagName('tr');
  57.   sum = new Array(filas.length);
  58.   for (i=0; i<sum.length; i++)
  59.     sum[i]=0;
  60.   for (i=2, tot=filas.length-1; i<tot; i++) {
  61.     total = 0;
  62.     celdas = filas[i].getElementsByTagName('td');
  63.     for (j=2, to=celdas.length-1; j<to; j++) {
  64.       num = parseFloat(celdas[j].innerHTML);
  65.       if (isNaN(num)) num = 0;
  66.       total += num;
  67.       sum[j-2] += num;
  68.     } // end for j
  69.     celdas[celdas.length-1].innerHTML = total;
  70.     sum[j-2] += total;
  71.   } // end for i
  72.  
  73.   subt = filas[filas.length-1].getElementsByTagName('td');
  74.   for (i=2, tot=subt.length; i<tot; i++)
  75.     subt[i].innerHTML = sum[i-2];
  76. } // end function
  77.  
  78. // añadir filas o columnas
  79. function anadir(obj,num) {
  80.   if (num==0) { // añadir filas
  81.   fila = obj.parentNode.parentNode;
  82.   nuevaFila = fila.cloneNode(true);
  83.   im = nuevaFila.getElementsByTagName('img');
  84.   im[0].onclick = function() {anadir(this,0)}
  85.   im[1].onclick = function() {borrar(this,0)}
  86.   for (i=2, tot=nuevaFila.getElementsByTagName('td').length-1; i<tot; i++) {
  87.     nuevaFila.getElementsByTagName('td')[i].onclick = function() {crearInput(this)} ;
  88.     nuevaFila.getElementsByTagName('td')[i].innerHTML = 0;
  89.   }
  90.   fila.parentNode.insertBefore(nuevaFila,fila);
  91.   } // end añadir filas
  92.  
  93.   else { // añadir columnas
  94.     tab = document.getElementById(miTabla);
  95.     cabecera = tab.getElementsByTagName('tr')[0];
  96.     // averiguar nº de columna
  97.     for (num=0; cel = cabecera.getElementsByTagName('td')[num]; num++)
  98.       if (cel==obj.parentNode) break;
  99.     for (i=0; fila = tab.getElementsByTagName('tr')[i]; i++) {
  100.       ele = fila.getElementsByTagName('td')[num];
  101.       nuevaColumna = ele.cloneNode(true);
  102.       if (i==0) {
  103.           im = nuevaColumna.getElementsByTagName('img');
  104.           im[0].onclick = function() {anadir(this,1)}
  105.           im[1].onclick = function() {borrar(this,1)}
  106.        }
  107.        else {
  108.           nuevaColumna.innerHTML = (i==1) ? '' : 0;
  109.           nuevaColumna.onclick = function() {crearInput(this)} ;
  110.       }
  111.       fila.insertBefore(nuevaColumna,ele);
  112.     } //end for i
  113.   } // end añadir columnas
  114.   mostrarImagenes();
  115. }
  116.  
  117. // borrar filas o columnas
  118. function borrar(obj,num) {
  119.   if (num==0) { // borrar filas
  120.     tab = obj.parentNode.parentNode.parentNode;
  121.     tab.removeChild(obj.parentNode.parentNode);
  122.   } // end borrar filas
  123.   else { // borrar columnas
  124.     tab = document.getElementById(miTabla);
  125.     cabecera = tab.getElementsByTagName('tr')[0];
  126.     // averiguar nº de columna
  127.     for (num=0; cel = cabecera.getElementsByTagName('td')[num]; num++)
  128.       if (cel==obj.parentNode) break;
  129.     for (i=0; fila = tab.getElementsByTagName('tr')[i]; i++)
  130.       fila.removeChild(fila.getElementsByTagName('td')[num]);
  131.   }
  132.   sumar();
  133.   mostrarImagenes();
  134. }
  135.  
  136. // mostrar/ocultar imagenes para borrar
  137. function mostrarImagenes() {
  138.   tab = document.getElementById(miTabla);
  139.   filas = tab.getElementsByTagName('tr');
  140.   columnas = filas[0].getElementsByTagName('td');
  141.   numFilas = filas.length;
  142.   numColumnas = columnas.length;
  143.   for (i=0; im=tab.getElementsByTagName('img')[i]; i++)
  144.     if (im.alt == 'borrar fila')
  145.       im.style.visibility = (numFilas>5) ? 'visible' : 'hidden';
  146.     else if (im.alt == 'borrar columna')
  147.       im.style.visibility = (numColumnas>5) ? 'visible' : 'hidden';
  148. }

agradesco de ante mano a javierb y espero su colaboracion muchas muchas muchas gracias de ante mano
  #3 (permalink)  
Antiguo 09/11/2011, 12:16
 
Fecha de Ingreso: junio-2006
Mensajes: 133
Antigüedad: 18 años, 5 meses
Puntos: 5
Respuesta: suma php y javascript

Hola!!

A los valores que tomas del formulario en la funcion calcular hazles un parseInt() para que te los tome como numero y no como cadena.
__________________
http://www.hostingyweb.net
  #4 (permalink)  
Antiguo 09/11/2011, 12:26
 
Fecha de Ingreso: noviembre-2011
Ubicación: bogota
Mensajes: 9
Antigüedad: 13 años
Puntos: 0
Respuesta: suma php y javascript

muchas gracias por tu amable respuesta bueno como comentaba antes no tengo ni idea de javascript llevo dias buscando algo que me pueda ayudar a dar un poco la solucion ... pero nada me a funcionado la verdad no tengo ni idea donde meter el parseint()

de nuevo muchas gracias por tu ayuda ...
  #5 (permalink)  
Antiguo 09/11/2011, 13:22
 
Fecha de Ingreso: junio-2006
Mensajes: 133
Antigüedad: 18 años, 5 meses
Puntos: 5
Respuesta: suma php y javascript

Hola!!

Cambia esta lnea

document.autoSumForm.valortotal.value = (uno*1)+(dos*1);

por algo asi

document.autoSumForm.valortotal.value = parseInt((uno*1))+parseInt((dos*1));
__________________
http://www.hostingyweb.net
  #6 (permalink)  
Antiguo 09/11/2011, 15:33
 
Fecha de Ingreso: noviembre-2011
Ubicación: bogota
Mensajes: 9
Antigüedad: 13 años
Puntos: 0
Respuesta: suma php y javascript

gracias por tu respuesta cabo de cambiar la linea pero sigue sumando la primera fila no sirve mas si quieres mirar un poco como esta
este es el lick http://celucentro.webcindario.com/index.php usuario caja2 contraseña 1234 agradesco mucho de antemano que me puedas colaborar gracias
  #7 (permalink)  
Antiguo 09/11/2011, 16:00
 
Fecha de Ingreso: junio-2006
Mensajes: 133
Antigüedad: 18 años, 5 meses
Puntos: 5
Respuesta: suma php y javascript

Hola !!

Viendo el vinculo funciona sin problema con 1 fila, pero con 2 o mas no sirve. El problema es que tienes dinamico el numero de filas en la pagina, pero en el javascript esta estatico.

A cada campo de texto le colocas el id "valor", pero deberia ser "valor1", "valor2", asi hasta valor n (n es el numero total de filas). Asi tanto en el cuerpo de la pagina como en el javascript que realiza la suma.

En resumen, tienes que modificar la funcion que suma y dejarla mas general (que sume desde hasta n cantidad de filas independientemente). Tambien te sirve utilizar como parametro "this.value" para los calculos
__________________
http://www.hostingyweb.net
  #8 (permalink)  
Antiguo 10/11/2011, 10:51
 
Fecha de Ingreso: noviembre-2011
Ubicación: bogota
Mensajes: 9
Antigüedad: 13 años
Puntos: 0
Respuesta: suma php y javascript

hola!!

mira estube mirando lo del codigo pero nada todavia nada lo hago con parseint y con parsefloat y nada deje el codigo asi y an sigue funcionando pero con 1 fila ya no suma nada mas
Código Javascript:
Ver original
  1. function MM_jumpMenu(targ,selObj,restore){
  2. eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
  3. if (restore) selObj.selectedIndex=0;
  4. }
  5. function Sumar(){  
  6.       interval = setInterval("calcular()",1);  
  7. }  
  8. function calcular(){  
  9. var n1 = parseFloat(document.autoSumForm('valor').value);
  10. var n2 = parseFloat(document.autoSumForm('comision').value);
  11. document.autoSumForm('valortotal').value = (n1*1)+(n2*1);
  12. }  
  13. function NoSumar(){  
  14.      clearInterval(interval);  
  15. }

sigo agradecendo de antemano tus respuestas y ojala podamos encontrar una solocion
  #9 (permalink)  
Antiguo 10/11/2011, 10:52
 
Fecha de Ingreso: noviembre-2011
Ubicación: bogota
Mensajes: 9
Antigüedad: 13 años
Puntos: 0
Respuesta: suma php y javascript

tambien hago el aporte de este link para los que necesita practicamente una calculadora suma resta divide multiplica esta muy bien explicado pero uan sigue sin funcionar lo que yo necesito http://iliberis.com/usuarios/root/javascript/javascript.htm

Etiquetas: php, solucion, suma, unitario, totales
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 04:34.