1

tengo varios dias ya rompiendome la cabeza y no logro ver donde esta el problema, tengo un formulario de facturacion donde se cargan los productos que se van a facturar, el primer campo es un select que lo lleno con una consulta a la BD, luego el campo precio se llena automatico con la informacion que trae de la base de datos, luego tengo 3 inputs mas donde coloco la cantidad, el descuento y el total, para ultimo mostrar un boton de agragar otro producto o eliminar producto, cuando le doy para agregar el segundo producto, me carga los inputs completo, llena el select con la consulta a la base de datos pero no me muestra el precio del producto seleccionado.

todo lo tengo dividido en 3 archivos .php, les dejo parte del codigo de cada archivo.

archivo precio.php

<?php
if($_SERVER["REQUEST_METHOD"] == "POST") {
$id_producto = htmlspecialchars(trim($_POST["id_producto"]));
include "../../conexion.php";
$db =  connect();
$sqlper = "SELECT * FROM maestro_producto WHERE id_producto='$id_producto'";
$rsper = mysqli_query($db,$sqlper) or die ('Consulta fallida: '.mysqli_error($db));
$rowper = mysqli_fetch_assoc($rsper);

$precio = $rowper['precio_venta'];

echo json_encode([
   'precio' => $precio,
]);
    
} else {
    echo "<p>No hay datos</p>";
}
?>

archivo items.php

<?php
include "conexion.php";
$db =  connecto();
$queryp=$db->query("SELECT * FROM maestro_producto");
$pro = array();
while($p=$queryp->fetch_object()){ $pro[]=$p; }
?>
<div class="form-row" style="color:#FFF" id="productos">
        <div class="float-left" style="margin-left:10px;">
        <input type="checkbox" name="item_index[]" />
        </div>
        <div class="form-group col-md-3">
        <select id="id_producto" name="id_producto">
        <option value="">--SELECCIONE--</option>
        <?php foreach($pro as $pr):?>
        <option value="<?php echo $pr->id_producto; ?>"><?php echo $pr->nombre_producto; ?></option>
        <?php endforeach; ?>
        </select>
        </div>
        <div class="form-group col-md-1">
        <input class="monto" id="precio_venta" type="text" autocomplete="off" maxlength="4" name="precio_venta" readonly onChange="multiplicar();">
        </div>
        <div class="form-group col-md-1">
        <input class="monto" id="cantidad_venta" type="text" required autocomplete="off" maxlength="4" name="cantidad_venta[]" onChange="multiplicar();">
        </div>
        <div class="form-group col-md-1">
        <input readonly id="subtotal" type="text" required autocomplete="off" maxlength="20" name="subtotal[]" onChange="descuento();">
        </div>
        <div class="form-group col-md-2">
        <input type="text" id="id_descuento" style="width: 70px;" name="id_descuento[]" onChange="descuento();"/>
        </div>
        <div class="form-group col-md-1">
        <input readonly id="total_parcial" type="text" maxlength="20" name="total_parcial[]">
        </div>
        <div class="form-group col-md-2">
        <input class="btn btn-success" type="button" name="agregar_registros" value="+" onClick="AgregarMas();" />
        <input class="btn btn-danger" type="button" name="borrar_registros" value="-" onClick="BorrarRegistro();" />
        </div>
    </div>
<script>
    document.getElementById("id_producto").onchange = function(){alerta1()};
    function alerta1() {
        // Creando el objeto para hacer el request
        var request = new XMLHttpRequest();
        request.responseType = 'json';
         // Objeto PHP que consultaremos
        request.open("POST", "precio.php");
         // Definiendo el listener
        request.onreadystatechange = function() {
            // Revision si fue completada la peticion y si fue exitosa
            if(this.readyState === 4 && this.status === 200) {
                // Ingresando la respuesta obtenida del PHP
                document.getElementById("precio_venta").value = this.response.precio;
             }
        };
        // Recogiendo la data del HTML
        var myForm = document.getElementById("myForm");
        var formData = new FormData(myForm);
        // Enviando la data al PHP
        request.send(formData);
    }
</script>

y el archivo de la factura como tal agregar_factura.php

<?php
header("Content-Type: text/html;charset=utf-8");
include "../../conexion.php";
$db =  connect();
$acentos = $db->query("SET NAMES 'utf8'");
    
$queryp=$db->query("SELECT * FROM maestro_producto");
$pro = array();
while($p=$queryp->fetch_object()){ $pro[]=$p; }
?>
<!DOCTYPE html>
<head>
<link rel="stylesheet" type="text/css" href="../../css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="../../css/estilo.css">
<script type="text/javascript" src="../../js/jquery.js"></script>
<script type="text/javascript" src="../../js/main.js"></script>
<script type="text/javascript" src="../../js/jquery.min.js"></script>
</head>
<body style="background-color:transparent">
<form action="guardarfactura.php" method="post" style="color: grey ; width: 90%; background: rgba(0,0,0,0.5); text-align: center; align-content:center; margin:auto; margin-top: 20px; margin-bottom: 5%; padding: 15px; border-radius: 30px; height:100%; border-style: solid;" id="myForm">
<h2 style="color:#F2A620">NUEVA FACTURA</h2><br>
    
    <div class="form-row" style="color:#FFF">
        <div class="form-group col-md-3">
        <label for="nombre">Cliente</label><br>
        <?php
        $queryc=$db->query("SELECT * FROM maestro_clientes");
        $cli = array();
        while($c=$queryc->fetch_object()){ $cli[]=$c; }
        ?>
        <select id="id_cliente" name="id_cliente">
        <option value="">--SELECCIONE--</option>
        <?php foreach($cli as $cl):?>
        <option value="<?php echo $cl->id_cliente; ?>"><?php echo $cl->nombre_cliente; ?></option>
        <?php endforeach; ?>
        </select>
        </div>
        <div class="form-group col-md-3">
        <label for="nombre">Vendedor</label><br>
        <?php
        $queryemp=$db->query("SELECT * FROM nomina_empleado WHERE id_empleado!='1'");
        $emp = array();
        while($e=$queryemp->fetch_object()){ $emp[]=$e; }
        ?>
        <select id="id_empleado" name="id_empleado">
        <option value="">--SELECCIONE--</option>
        <?php foreach($emp as $em):?>
        <option value="<?php echo $em->id_empleado; ?>"><?php echo $em->nombres_completo; ?></option>
        <?php endforeach; ?>
        </select>
        </div>
    </div>

<div class="form-row" style="color:#FFF">
        <div class="form-group col-md-3">
        <label for="nombre">Nombre Producto</label><br>
        </div>
        <div class="form-group col-md-1" style="margin-left:30px;">
        <label>Precio</label><br>
        </div>
        <div class="form-group col-md-1" style="margin-left:-10px;">
        <label for="nombre">Cantidad</label><br>
        </div>
        <div class="form-group col-md-1" style="margin-left:20px;">
        <label for="contacto">Sub-Total</label><br>
        </div>
        <div class="form-group col-md-2" style="margin-left:-20px;">
        <label for="nombre">Descuento</label><br>
        </div>
        <div class="form-group col-md-1">
        <label >Total</label><br>
        </div>
</div>

    
    <div id="productos">
    <?php require_once("items.php") ?>
    </div>
        <span class="success"><?php if(isset($resultado)) { echo $resultado; }?></span>
        <div align="center"><br>
        <input type="submit" name="Agregar" value="AGREGAR" class="btn btn-light btn-lg">
        </div>
</form>



<script>
function multiplicar(){
  m1 = document.getElementById("precio_venta").value;
  m2 = document.getElementById("cantidad_venta").value;
  r = m1*m2;
  document.getElementById("subtotal").value = r;
}
</script>
<script>
function descuento(){
  px =  '100';
  d1 = document.getElementById("subtotal").value;
  d2 = document.getElementById("id_descuento").value;
  d3 = d2/px;
  r1 = d1*d3;
  r2 = d1-r1
  document.getElementById("total_parcial").value = r2;
}
</script>

<script>
function AgregarMas() {
    $("<div>").load("items.php", function() {
            $("#productos").append($(this).html());
    }); 
}
function BorrarRegistro() {
    $('div.form-row').each(function(index, item){
        jQuery(':checkbox', this).each(function () {
            if ($(this).is(':checked')) {
                $(item).remove();
            }
        });
    });
}
</script>
</body>
</html>

Espero me puedan ayudar. Gracias de antemano.

Asi es como se me muestra en estos momentos, notese que no trae el precio en la segunda linea

5
  • 1
    Convendría que especifiques con claridad dónde es el problema. Al parecer es al invocar la función AgregarMas(). Si observas, cada vez que invocas esa función llamas a items.php que te carga de nuevo todos los productos. El contexto tampoco está bien explicado en la pregunta, por ejemplo, de entrada, ¿cómo se presenta la página? ¿hay una lista de productos precargada de la cual el usuario selecciona el que quiere comprar? Es fundamental entender ese contexto inicial para poder ayudarte. Por ejemplo, podríamos pensar en una lista de productos ya con su precio ...
    – A. Cedano
    Commented el 11 oct. 2020 a las 18:10
  • 1
    ... para que no haya necesidad de ir cada vez a buscar el precio en la base de datos. En casos como estos conviene primero definir el problema, incluso de una forma teórica, poniendo por escrito lo que quieres hacer y luego codifcarlo. Da la impresión de que estás perdido en un embrollo de código complicado cuando el problema se puede resolver de una forma más simple.
    – A. Cedano
    Commented el 11 oct. 2020 a las 18:11
  • Los precios viene por base de datos, casados con los productos que se muestran en el select, el usuario selecciona un producto y automaticamente le muestra el precio en el siguiente input... cuando le doy al boton de agregar otro producto, vuelve a cargar el select de los productos y cuando selecciono un producto nuevo, no muestra el precio en el input siguiente... ese es el problema que tengo. Commented el 12 oct. 2020 a las 1:09
  • Es importante que expliques con claridad cómo funciona para que podamos ayudarte mejor. Por ejemplo: ¿qué ocurre en principio, cuando el usuario abre la página por primera vez, se cargan todos los productos sí o no? ¿Cómo se cargan los precios, van a buscarse a la BD cada vez que el usuario selecciona un producto? ¿Por qué no se cargan en principio, en caso de que la lista de productos se cargue completa en la página? (se podría pensar en un JOIN que traiga productos y precios, guardas el precio en un atributo data- y lo muestras dinámicamente cuando el producto sea seleccionado) eso ...
    – A. Cedano
    Commented el 12 oct. 2020 a las 8:04
  • ... evitará tantas idas y venidas al servidor ganando en rendimiento y en rapidez, además de tener algo más de claridad y coherencia sobre tu problema y el contexto. Por eso te decía antes que es fundamental que te detengas a comprender el problema e incluso a describirlo de una forma teórica antes de meterte en un código que puede terminar siendo un embrollo y una solución muy costosa (cómo sería ir cada vez al servidor a buscar el precio de un producto).
    – A. Cedano
    Commented el 12 oct. 2020 a las 8:07

1 respuesta 1

0

Cuando manejas una relación de padre-hijos en el display, debes identificar de manera UNICA cada línea "hija" de lo contrario entras en un conflicto entre lo que tienes seleccionado y lo que pides, analiza el código resultante en html y asegurate que cada SELECT tiene un identificador único, ej.

incorrecto!

<select id="id_producto" name="id_producto"> <!-- siempre el select tiene el mismo id en todos los renglones ->
<option value="">--SELECCIONE--</option>
<?php foreach($pro as $pr):?>
<option value="<?php echo $pr->id_producto; ?>"><?php echo $pr->nombre_producto; ?></option>
<?php endforeach; ?>
</select>

correcto!

    <select id="id_producto<?php echo $num_renglon; ?>" name="id_producto<?php echo $num_renglon; ?>">
    <option value="">--SELECCIONE--</option>
    <?php foreach($pro as $pr):?>
    <option value="<?php echo $pr->id_producto; ?>"><?php echo $pr->nombre_producto; ?></option>
    <?php endforeach; ?>
    </select>

al añadir un numero de renglon haces que cada select sea unico evitando que tomes el valor de otro.

Espero que esto resuelva tu problema, o al menos te de una pista para solucionarlo.

2
  • Me dio la idea y creo que por ahi van los tiros, me perdi fue en $num_renglon, como lo obtengo, de donde lo saco? y al momento de colocarlo en el script seria algo asi: ``` document.getElementById("id_producto<?php echo $num_renglon; ?>").onchange = function(){alerta1()}; ``` Commented el 12 oct. 2020 a las 19:41
  • El $num_renglon lo tienes que generar en la rutina que genera los renglones, podria ser una buena idea usar un id (unico, autoincrementable) en el detalle (renglones), con esto podrias usarlo como "$num_renglon"... por otro lado yo embeberia en el html el "onchange"... ej. <div onchange="alerta1(this);"> Commented el 15 oct. 2020 a las 19:29

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.