Modificar campos y que otros campos se vean afectados en la misma pagina con PHP

[erickmpos]

Buenas compañeros y compañeras,

Me gustaria saber si es posible que si yo modifico un campo de una tabla (PHP y HTML), indirectamente se vea afectado otro campo de la tabla, luego de haber ingresado el dato, les dare un ejemplo para ver si me doy a entender mejor:

1. Tengo una tabla con una serie de inputs en una pagina(en la parte visual con PHP y HTML):
Nombre: Agua
Tipo: Gravado (hay 2 tipos: Gravado y Exento)
Precio Venta 500
Costo 200
Imp.Venta 26
Utilidad Colones 274

2. Ocupo modificar el campo "Tipo" y poner Exento, entonces inmediatamente ocupo que el campo ImpVenta se ponga en "0".
3. Si yo modifico el campo "Costo", entonces ocupo que se modifique automaticamente el campo Imp.Venta y por ende se debe modificar el campo Utilidad colones.

Es posible realizar todo esto en la misma pagina, sin la necesidad de hacer un boton y que me envie los nuevos datos a otra pagina y realice las formulas?

Esto me gustaria hacerlo con el fin de no tener la necesidad de estarme saliendo de la pagina actual y saber los resultados en otra pagina, y asi no perder tanto tiempo en entrar a una pagina y salir de esa para entrar a otra y asi poder trabajar todo en la misma pagina que estoy interaccionando.

Espero darme a entender y cualquier ayuda se los agradeceria, he buscado por todo lado y no encuentro como hacerlo o saber si es posible hacerlo.
Saludos,

[pateketrueke]

Es posible realizar todo esto en la misma pagina, sin la necesidad de hacer un boton y que me envie los nuevos datos a otra pagina y realice las formulas?

Sí, pero no podrías usar PHP para eso, en su lugar debes hacerlo todo con Javascript.

[xfxstudios]

eso es js amigo, igual de realice un ejemplo, ve si es lo que necesitas y modificalo a tus requerimientos:

se podria simplificar un poco mas pero es la idea base i principal:

Código Javascript:

/*Verificamos el valor del impuesto seleccionado y llamamos a la funcion que realiza el calculo*/
$("select[id=imp]").on("change", function(){
    
  $("input[name=impVenta]").val($(this).val());
  
  calcula();
  
})
/*Calcula la utilidad basado en el impuesto seleccionado*/
function calcula(){
 
    if($("input[name=impVenta]").val()== "Seleccione Impuesto"){
 
            $("input[name=utilidad]").val(0)
 
    }else{
 
        var pVenta = parseInt($("input[name=costo]").val());
        var cargo = parseInt(($("input[name=costo]").val() * 
 
        $("input[name=impVenta]").val())/100);
  
        $("input[name=utilidad]").val(pVenta+cargo);
 
    }
 
}
 
/*Verifica en tiempo real si hay algun cambio en el campo costo para recalcular la utilidad de este nuevo monto*/
$("input[name=costo]").on("change", function(){
 
    calcula();
 
})
 

ejemplo de uso:

https://jsfiddle.net/xfxstudios/a6ktk4nu/

[erickmpos]

Buenas, muchas gracias por la ayuda, y como consulta, es posible combinar PHP con JS? o debo hacer esa pagina completamente en JS? mi pregunta, es porque jamas he utilizado ese lenguaje y no se si seran compatibles.

Muchas gracias de antemano.

[rodocoyote15]

No sé a qué te refieras con hacerla toda en JS.
Php y JS son muy diferentes, uno trabaja del lado del servidor y otro del cliente, respectivamente.

Tú mismo te darás cuenta donde tienes que usar sí o sí php o js. Ya que no con ambos puedes realizar las mismas funciones.

Por ejemplo, en este caso tenías que trabajar con JS ya que php no puede hacer lo que tú necesitas.

En una página web, html, php, js y css van de la mano.

[erickmpos]

Excelente!, entonces lo que hare es tratar de ver si puedo hacer al menos esta parte en JS y el resto lo sigo trabajando con PHP.
Muchas gracias por toda la info, cualquier cosa si tengo alguna duda le puedo preguntar?

[erickmpos]

Solamente una consulta, si uso un archivo JS, no puedo combinarlo con HTML, entonces como hago para hacer el link entre el archivo JS y HTML?

[erickmpos]

Amigo xfxstudios estoy haciendo exactamente lo mismo del link que me paso: https://jsfiddle.net/xfxstudios/a6ktk4nu/ sin embarog, no se si estare haciendo el enlazado entre paginas correctamente, por ejemplo, lo hice de 2 formas:
1. Hice un llamado a otra pagina JS <script type="text/javascript" src="pruebaerick.js"></script>

Código HTML:

<!DOCTYPE html>
 
<html>
    <head>
        <title>TODO supply a title</title>
        
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <script type="text/javascript" src="pruebaerick.js"></script>
        <p>En esta Formula de Prueba podemos ver que luego de colocar el precio de venta y el costo al seleccionar el impuesto este nos calcula automaticamente la utilidad</p>
        <input type="text" name="articulo" placeholder="Articulo" />
 
        <input type="text" name="pVenta" placeholder="Precio de Venta"/>
        <input type="text" name="costo" placeholder="Costo"/>
        <select id="imp">
          <option value="Seleccione Impuesto">Seleccione Impuesto</option>
          <option value="26">Gravado 26%</option>
          <option value="0">Excento 0%</option>
        </select>
        <br><hr>
        <label for="">Impuesto de Venta</label>
        <input type="text" name="impVenta" placeholder="Impuesto de Venta" value="Seleccione Impuesto" readonly/><br><br>
        <label for="">Utilidad</label>
        <input type="text" name="utilidad" placeholder="Utilidad Colones"/>
    </body>
</html>
 

2. Lo hice todo dentro de la misma pagina:

Código HTML:

<!DOCTYPE html>
 
<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <script type="text/javascript">
                            /*Verificamos el valor del impuesto seleccionado y llamamos a la funcion que realiza el calculo*/
                $("select[id=imp]").on("change", function(){
 
                  $("input[name=impVenta]").val($(this).val());
 
                  calcula();
 
                });
                /*Calcula la utilidad basado en el impuesto seleccionado*/
                function calcula(){
 
                        if($("input[name=impVenta]").val()=== "Seleccione Impuesto"){
 
                                        $("input[name=utilidad]").val(0);
 
                        }else{
 
                                var pVenta = parseInt($("input[name=costo]").val());
                                var cargo = parseInt(($("input[name=costo]").val() * 
 
                                $("input[name=impVenta]").val())/100);
 
                                $("input[name=utilidad]").val(pVenta+cargo);
 
                        }
 
                }
 
                /*Verifica en tiempo real si hay algun cambio en el campo costo para recalcular la utilidad de este nuevo monto*/
                $("input[name=costo]").on("change", function(){
 
                        calcula();
 
                });
            
        </script>
        <p>En esta Formula de Prueba podemos ver que luego de colocar el precio de venta y el costo al seleccionar el impuesto este nos calcula automaticamente la utilidad</p>
        <input type="text" name="articulo" placeholder="Articulo" />
 
        <input type="text" name="pVenta" placeholder="Precio de Venta"/>
        <input type="text" name="costo" placeholder="Costo"/>
        <select id="imp">
          <option value="Seleccione Impuesto">Seleccione Impuesto</option>
          <option value="26">Gravado 26%</option>
          <option value="0">Excento 0%</option>
        </select>
        <br><hr>
        <label for="">Impuesto de Venta</label>
        <input type="text" name="impVenta" placeholder="Impuesto de Venta" value="Seleccione Impuesto" readonly/><br><br>
        <label for="">Utilidad</label>
        <input type="text" name="utilidad" placeholder="Utilidad Colones"/>
    </body>
</html>
 

Ninguna de las 2 formas me funciona, que estare haciendo mal?

[xfxstudios]

te falta la libreria jquery, prueba asi nuevamente:

Código HTML:

<!DOCTYPE html>
 
<html>
    <head>
        <title>TODO supply a title</title>
        
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
<!--AQUI LLAMAMOS LA LIBRERIA JQUERY-->
<script src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
        <script type="text/javascript" src="pruebaerick.js"></script>
        <p>En esta Formula de Prueba podemos ver que luego de colocar el precio de venta y el costo al seleccionar el impuesto este nos calcula automaticamente la utilidad</p>
        <input type="text" name="articulo" placeholder="Articulo" />
 
        <input type="text" name="pVenta" placeholder="Precio de Venta"/>
        <input type="text" name="costo" placeholder="Costo"/>
        <select id="imp">
          <option value="Seleccione Impuesto">Seleccione Impuesto</option>
          <option value="26">Gravado 26%</option>
          <option value="0">Excento 0%</option>
        </select>
        <br><hr>
        <label for="">Impuesto de Venta</label>
        <input type="text" name="impVenta" placeholder="Impuesto de Venta" value="Seleccione Impuesto" readonly/><br><br>
        <label for="">Utilidad</label>
        <input type="text" name="utilidad" placeholder="Utilidad Colones"/>
    </body>
</html>
 

[loncho_rojas]

Esto es un foro de PHP, no de jQuery...

[erickmpos]

buenas xfxstudios,

Ya lo hice y no me funcionò, no se que sera lo que estoy haciendo mal, porque en el momento en que selecciono el impuesto, este no me hace ningun cambio en el input de Impuesto de Venta y por ende tampoco en Utilidad, no se si estara mal los inputs:

Código HTML:

<label for="">Impuesto de Venta</label>
        <input type="text" name="impVenta" placeholder="Impuesto de Venta" value="Seleccione Impuesto" readonly/><br><br>
        <label for="">Utilidad</label>
        <input type="text" name="utilidad" placeholder="Utilidad Colones"/>
 

Ya que me dice que un input con un FOR="" no deberia estar vacio, igual les quito el FOR y no me funciona...

[xfxstudios]

Iniciado por loncho_rojas

Esto es un foro de PHP, no de jQuery...

Creo que es obvio pero si nadie lo ha movido como se le hace, muevanlo al topic que le corresponde y se continua allí el asunto. Saludos