Foros del Web - Ver Mensaje Individual

vicram10 · #4 (**permalink**) 04/07/2012, 06:40

y no te sera mejor traer ya en la consulta SQL el total?.. asi ya se actualizara de forma automatica.. sino seria agregar con javascript para que vuelva a sumar los nuevos valores y que se refleje el resultado.. con jquery seria facil..

Te dejo un ejemplo con jquery...

index.php

Código HTML:

Ver original<!DOCTYPE html>
<html lang="es">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Recalculo Jquery</title>
</head>
<body>
<form name="fcalculo" id="fcalculo" action="calcular.php" method="post">
    <h2>Nro. 1:</h2>
    <input type="text" name="nro_1" id="nro_1" value="<?php echo !empty($nro_1) ? $nro_1 : ''; ?>" />
    <h2>Nro. 2:</h2>
    <input type="text" name="nro_2" id="nro_2" value="<?php echo !empty($nro_2) ? $nro_2 : ''; ?>" />
    <br />
    <input type="submit" name="btncalcular" id="btncalcular" value="Calcular">
</form>
<br />
<div id="resultado"></div>
<!-- llamamos al jquery -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="http://projects.ramirezmedina.com/worldnavi/rmi/js/jquery.form.js" type="text/javascript"></script>
<!-- aqui le decimos que queremos hacer -->
<script type="text/javascript">
    $(document).ready(function() { 
        $('#btncalcular').live('click', function(){ 
            $("#resultado").append('<img src="http://projects.ramirezmedina.com/worldnavi/rmi/images/cargando.gif" />');
            $("#fcalculo").ajaxForm({
                target: '#resultado'
            }).submit();            
        });
    }); 
</script>
</body>
</html>

calcular.php

Código PHP:

Ver original<?php
//aca realizamos el calculo para mostrarlo luego
if (isset($_POST['btncalcular']))
{
    $nro_1 = !empty($_POST['nro_1']) ? (int) $_POST['nro_1'] : 0;
    $nro_2 = !empty($_POST['nro_2']) ? (int) $_POST['nro_2'] : 0;
    $calculo = $nro_1 * $nro_2;
    echo '<span style="font-weight:bold;">Resultado:</span>&nbsp;',$calculo;
}
?>

Se debe tener el ultimo jquery.min.js y jquery.form.js