Operaciones senciillas Formulario

kikoguanabacoa · #1 (**permalink**) 24/09/2010, 11:47

Buenas a todos.

Estoy haciendo mis pininos en programacion WEB he investigado un poco por alla y por aca, tengo un pequeño proyecto que me encargaron.

El problema que tengo (ya es el unico al parecer) es que quiero sumar un par de valores de textbox inmediatamente que cambie de textbox sin necesidad de hacer un submit o presionar algun boton. Ya lo pude hacer con el boton pero me indican que debe ser automatico el resultado de las operaciones ya que el usuario debe verificar estos antes de enviar el formulario a la tabla.

tengo que sumar Importe:_______ mas IVA:_____ igual *Total:_________

porteriormente tengo que llenar el campo Cobrado:_________ menos *Total:_______ igual a Saldo:________

Ojala me puedan ayudar ya solo me falta eso para hacer la primer presentacion.

Lo tengo que hacer en otras paginas pero ya con su amable ayuda lo solucionaria.

De antemano Mil Gracias!!!

_cronos2 · #2 (**permalink**) 24/09/2010, 11:56

Primero, no entendí lo de los xcampos, si pudieras postear tu código HTML. Después, para hacer lo que tú quieres sin usar el botón tienes que usar la misma función y en los campos usar onblur.
Saludos (:

kikoguanabacoa · #3 (**permalink**) 24/09/2010, 12:01

_cronos2:

No cabe todo el HTML me lo bota pero si gustas te mando a tu correo la pagina, estoy seguro que es algo muy facil pero la vdd no he encontrado como hacerle.

te doy mi correo: [email protected]

malakian · #4 (**permalink**) 24/09/2010, 12:02

hola kikoguanabacoa...

la verdad soy novato en todo esto... te dare mi opinion de noob :P

en la segunda caja de textusar lafuncion onchange(), y ahi llamas a una funcion "sumar()" por ejemplo y sumas los valores de los 2 campos:

Código Javascript:

Ver originalsuma = document.form.campo1.value + document.form.campo2.value;

donde campo1 y campo2 son losnombres de sus cajas de texto luego en lamisma funcion leasignas el valor de "suma" al total...

Código Javascript:

Ver originaldocument.form.total.value = suma;

espero alla entendido su problema y espero le sirva... si no es asi hagalo saber!!!
recuerde soy un noob jejeje no se burlen..

kikoguanabacoa · #5 (**permalink**) 24/09/2010, 12:22

Asi es como lo intente malakian y _cronos2 pero no jalo :( a ver que tal:

//Aqui meti la funcion.

<script>
function sumatotal(){
suma = document.form.importes.value + document.form.ivas.value;
document.form.total.value = suma;
}

</script>

//Estos son mis campos

<input name="importe" type="text" size="20" id="importes" /> ** este es el primer campo a sumar**

<input name="iva" type="text" size="20" id="ivas" onchange("sumatotal()") /> ** este es el segundo campo a sumar**

<input name="total" type="text" size="20" disabled="true" id="totales" /> ** este es el campo de resultado **

_cronos2 · #6 (**permalink**) 24/09/2010, 12:37

onchange es un atributo como id o como name, así que es onchange="sumatotal();" y no onchange("sumatotal()"). Por otro lado, lo que tú necesitas no es onchange, sino onblur, que funciona cuando un campo pierde el foco. También deberías validar que el valor de los campos sea un número, porque si no es un número te devolverá NaN (Not a Number), que sucede cuando por ejemplo sumas 7 + 'a'.
Saludos (:

kikoguanabacoa · #7 (**permalink**) 24/09/2010, 15:19

Ya lo intente con ambas instrucciones onblur y onchange sin embargo el campo de totales no se llena AYUDAAAAAAAAAAAAAAAA!!!

_cronos2 · #8 (**permalink**) 24/09/2010, 15:22

Pues postea el código tal y como lo tengas ahora, ¿si no cómo voy a saber dónde está el error?

kikoguanabacoa · #9 (**permalink**) 24/09/2010, 15:27

He subido ya la pagina en la siguiente liga. los campos que pretendo llenar automaticamente son "TOTAL" y "SALDO", apiadence de este pobre NOOB como dice MALAKIAN.

la liga es esta:

http://www.gmcontrol.grupomendez.com/ctas_x_cobrar.php

los campos que pretendo llenar son

TOTAL=IMPORTE+IVA

y

SALDO=TOTAL-COBRADO

Gracias!!!!

kikoguanabacoa · #10 (**permalink**) 24/09/2010, 15:38

<?php
$mensaje="";
require_once('clases/funciones.php');
$miSocios = new Socios();
$clientes=$miSocios->regresadatoscliente();
$row;
$bancos=$miSocios->regresabancos();
$row;

$loginFormAction= $_SERVER['PHP_SELF'];
$misfunciones = new bancos();
if(isset($_POST['fecha']))
{
$idbanco = $misfunciones->regresaIdBanco($_POST['nombanco']);
}

$loginFormAction= $_SERVER['PHP_SELF'];
$misfunciones = new bancos();
if(isset($_POST['fecha']))
{
$row = $misfunciones->regresaIdCliente($_POST['nombrecliente']);

$misfunciones->cxcobrar($_POST['recibodinero'],$row['idcliente'],$idbanco['idbanco'],$_POST['fecha'],$_POST['factura'],$_POST['importe'],$_POST['iva'],$_POST['total'],$_POST['cobrado'],$_POST['saldo']);
$mensaje="Registro Guardado";
}
?>
function vacio(q) {
for ( i = 0; i < q.length; i++ ) {
if ( q.charAt(i) != " " ) {
return true
}
}
return false
}
<script>
function sumatotal(){
sumatotal = document.form.importes.value + document.form.ivas.value;
document.form.total.value = sumatotal;
}

</script>
<title>Ctas. X Cobrar</title>


<meta http-equiv="Content-Type" content="text/html; charset=-???-" />
<meta http-equiv="Content-Language" content="-???-" />
<meta http-equiv="last-modified" content="28/07/2010 11:39:25" />
<meta http-equiv="Content-Type-Script" content="text/javascript" />
<meta name="description" content="Control de Egresos e Ingresos" />
<meta name="keywords" content="" />

<meta http-equiv="Expires" content="0" />
<meta name="Resource-Type" content="document" />
<meta name="Distribution" content="global" />
<meta name="Robots" content="index, follow" />
<meta name="Revisit-After" content="21 days" />
<meta name="Rating" content="general" />

<meta name="Generator" content="Incomedia WebSite X5 Evolution 8.0.11 - www.websitex5.com" />
<meta http-equiv="ImageToolbar" content="False" />
<meta name="MSSmartTagsPreventParsing" content="True" />


<link rel="sitemap" href="imsitemap.html" title="-???-" />

<script type="text/javascript" src="res/x5engine.js"></script>
<link rel="stylesheet" type="text/css" href="res/styles.css" media="screen, print" />
<link rel="stylesheet" type="text/css" href="res/template.css" media="screen" />
<link rel="stylesheet" type="text/css" href="res/print.css" media="print" />

<link rel="stylesheet" type="text/css" href="res/p001.css" media="screen, print" />
<link rel="stylesheet" type="text/css" href="res/handheld.css" media="handheld" />
<link rel="alternate stylesheet" title="-???-" type="text/css" href="res/accessibility.css" media="screen" />

<style type="text/css">

</style>
</head>
<body>
<div id="imSite">
<div id="imHeader">
<h1>GM-Control</h1>
</div>
<div class="imInvisible">
<hr />
<a href="#imGoToCont" title="-???-">-???-</a>
</div>
<div id="imBody">
<div id="imMenuMain">


<h2>Captura Ingresos.</h2>
<p>
<h2>TIPO DE DOCUMENTO</h2>
<form id="form1" method="post" action="<?php echo $loginFormAction;?>">
<table width="669" height="38" border="0">
<tr>
<td width="115"> </td>
<td width="183"><label>
<input name="recibodinero" type="radio" value="0" />
</label>
<span class="Estilo1">RECIBO DINERO</span></td>
<td width="297"><label>
<input name="recibodinero" type="radio" value="1" />
</label>
<span class="Estilo1">RECIBO HONORARIOS</span></td>
<td width="56"> </td>
</tr>
</table>
<table width="668" height="33" border="0">
<tr>
<td width="162"> </td>
<td width="69"><span class="imLockLabel Estilo1 Estilo1 Estilo1 Estilo1">CLIENTE:</span></td>
<td width="406">
<p>
<label>
<?php
echo "<select name=\"nombrecliente\">";
while($row=mysql_fetch_array($clientes))
{
echo "<option >".$row['nomcliente']."</option>";
}
echo "</select>";
?>
</label>
</p>
</td>
<td width="13"> </td>
</tr>
</table>
<table width="668" height="33" border="0">
<tr>
<td width="163"> </td>
<td width="70"><span class="imLockLabel Estilo1 Estilo1 Estilo1 Estilo1">BANCO:</span></td>
<td width="356"><p>
<label>
<?php
echo "<select name=\"nombanco\">";
while($row=mysql_fetch_array($bancos))
{
echo "<option >".$row['nombrebanco']."</option>";
}
echo "</select>";
?>
</label>
</p></td>
<td width="61"> </td>
</tr>
</table>
<p> </p>
<table width="667" height="44" border="0">
<tr>
<td width="121"> </td>
<td width="54"><span class="imLockLabel Estilo1 Estilo1 Estilo1 Estilo1">FECHA:</span></td>
<td width="141"><input name="fecha" type="text" size="20" id="fechas" /></td>
<td width="75"><span class="imLockLabel Estilo1 Estilo1 Estilo1 Estilo1">FACTURA:</span></td>
<td width="140"><input name="factura" type="text" size="20" id="facturas"/></td>
<td width="110"> </td>
</tr>
</table>
<table width="667" height="44" border="0">
<tr>
<td width="141"> </td>
<td width="71"><span class="imLockLabel Estilo1 Estilo1 Estilo1 Estilo1">IMPORTE:</span></td>
<td width="141"><input name="importe" type="text" size="20" id="importes" /></td>
<td width="40"><span class="imLockLabel Estilo1 Estilo1 Estilo1 Estilo1">IVA:</span></td>
<td width="233"><input name="iva" type="text" size="20" id="ivas" onblur"sumatotal();" /></td>
<td width="15"> </td>
</tr>
</table>
<table width="669" height="34" border="0">
<tr>
<td width="98" height="30"> </td>
<td width="217"><span class="imLockLabel Estilo1 Estilo1 Estilo1 Estilo1">TOTAL:
<input name="total" type="text" size="20" disabled="true" id="total" />
</span></td>
<td width="340"><span class="imLockLabel Estilo1 Estilo1 Estilo1 Estilo1">COBRADO:
<input name="cobrado" type="text" size="20" id="cobrado"/>
</span></td>
</tr>
</table>
<table width="669" height="33" border="0">
<tr>
<td width="347"> </td>
<td width="55"><span class="imLockLabel Estilo1 Estilo1 Estilo1 Estilo1">SALDO:</span></td>
<td width="253"><span class="imLockLabel Estilo1 Estilo1 Estilo1 Estilo1">
<input name="saldo" type="text" size="20" disabled="true" id="saldos" />
</span></td>
</tr>
</table>
<p> </p>
<p>  </p>
<table width="664" height="34" border="0">
<tr>
<td width="244"> </td>
<td width="114">
<p>
<label>
<input type="submit" name="button2" id="button2" value="Guardar" />
</label>
</p>
</td>
<td width="194">
<p>
<label>
<input type="submit" name="button" id="button" value="Cancelar" />
</label>
</p>
</td>
<td width="94"> </td>
</tr>
</table>
</form>
<script language="JavaScript" type="text/javascript">
var frmvalidator = new Validator("form1");
frmvalidator.addValidation("recibodinero","selone_ radio","Elija Honorarios o dinero");
frmvalidator.addValidation("fecha","req","Por favor ingrese fecha");
frmvalidator.addValidation("factura","req","Por favor ingrese factura");
frmvalidator.addValidation("importe","req","Por favor ingrese importe");
frmvalidator.addValidation("iva","req","Por favor ingrese iva");
frmvalidator.addValidation("total","req","Por favor ingrese total");
frmvalidator.addValidation("cobrado","req","Por favor ingrese lo cobrado");
frmvalidator.addValidation("saldo","req","Por favor ingrese saldo");

</script>
<p> </p>
<p>

</p>
<p id="imFooterSiteMap"><a href="index.php" title="">Inicio</a> | <a href="ctas_x_cobrar.php" title="">Captura</a> | <a href="movimientos.php" title="">Consulta</a> | <a href="clientes.php" title="">Catalogos</a> | <a href="cuentas_por_cobrar.php" title="">Reportes</a> | <a href="imsitemap.php" title="-???-">-???-</a></p>
</div>
<div id="imMenuSub">
<hr class="imHidden" />
<p class="imHidden">-???-</p>
<ul>
<li class="imMenuSubCur">Ctas. X Cobrar <span class="imHidden"> ←</span></li>
<li><a href="ctas_x_pagar.php" title="">Ctas. X Pagar</a></li>
</ul>
</div>

kikoguanabacoa · #11 (**permalink**) 24/09/2010, 15:40

Listo viene lo escencial

el PHP y el formulario y el javascript

ojala se puede que me eches la mano mi hermano!!!

GRACIAS!!!!

_cronos2 · #12 (**permalink**) 24/09/2010, 16:30

Espero que no creas que voy a corregirte el pedazo de tocho de código ese. Yo te puedo ayudar, pero no puedo hacer tu trabajo, ese código lo puedes entender tú que eres el creador, pero no yo. Lo primero, la parte del PHP, CSS y demás sobraba, porque el problema que tienes es de JS. Te voy a montar un pequeño ejemplo para que veas cómo tienes que encaminar esto, y si tienes alguna duda me lo dices.

Código Javascript:

Ver originalvar a =  document.getElementById('total');
var b=document.getElementById('importe');
var c=document.getElementById('iva');
var d=document.getElementById('saldo');
var e=document.getElementById('cobrado');
function valores(){
 a.value = b.value + c.value;
 d.value = a.value - e.value;
}

Código HTML:

Ver originalTotal:<input type='text' id='total' onblur='valores();' />
Importe:<input type='text' id='importe' onblur='valores();' />
I.V.A.:<input type='text' id='iva' onblur='valores();' />
Saldo:<input type='text' id='saldo' onblur='valores();' />
Cobrado:<input type='text' id='cobrado' onblur='valores();' />

Saludos (: