0

Tengo un formulario en html el cual agrega dinámicamente lineas, en cada linea esta el nombre del producto, cantidad, precio unitario y total.

Lo ideal seria que se algo asi (Tomates 10 15 150) en donde tengo el producto que es tomate, con 10 unidades, el precio unitario es de 15 y el precio total es de 150, si agrego una nueva línea pues lo ideal es que haga lo mismo, sin embargo no lo hace, solo hace la operación de la primera linea

Las funciones para agregar las nuevas lineas es esta

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

Este es el formulario

<div id="row" class="text-center">   
    <div class="col-sm-1">&nbsp; Nro.</div>     
    <div class="col-sm-5 center-block" > Descripción</div>
    <div class="col-sm-2" >Cantidad</div>
    <div class="col-sm-2 center-block" >Costo Unitario</div>
    <div class="col-sm-2 center-block" >Costo Total</div>
</div>
<div class="clearfix"></div>
<div id="productos">
    <?php require_once("InputDinamico.php") ?>        
</div>

Y esta es funcion de la multiplicación y la linea que agrego, este es el InputDinamico.php

<script>
function multi(valor){
  m1 = document.getElementById("txt_campo_1").value;
  m2 = document.getElementById("txt_campo_2").value;
  r = m1*m2;
  document.getElementById("spTotal1").value = r;
}

<div class="lista-producto">
<ul class="list-group">
   <li class="row list-group-item">        
        <div class="col-sm-1 center-block">
            <input class="center-block" type="checkbox" name="item_index[]" /></div>
        <div class="col-sm-5">
            <input class="form-control center-block" type="text" name="pro_nombre[]" /></div>
        <div class="col-sm-2">
            <input class="form-control center-block" type="text" name="pro_precio[]" value=0 id="txt_campo_1" onchange="multi(this.value);" /></div>
        <div class="col-sm-2">
            <input class="form-control center-block" type="text" name="pro_cantidad" value=0 id="txt_campo_2"  onchange="multi(this.value);"/></div>
        <div class="col-sm-2 center-block">
            <input class="form-control center-block" type="text" name="pro_total" id="spTotal1" style="width:110px;"/></div>

    </li>
 </ul> 
</div>

Como se podria solucionar eso? Gracias por su ayuda

6
  • La función que estás usando para ejecutar la multiplicación siempre toma los valores de los elementos con IDs: txt_campo_1 y txt_campo_2, por lo que siempre vas a estar operando con los elementos de la primera fila. Sin ver la función con la que insertas nuevas filas no sabría decirte que más posibles errores podrías estar teniendo.
    – phpMyGuel
    Commented el 5 feb. 2019 a las 14:33
  • @PHPMyguel, ahi agregue la funcion para agregar las filas, gracias por la ayuda
    – Joe
    Commented el 5 feb. 2019 a las 14:40
  • ¿Y qué tienes en InputDinamico.php? Súbelo también porque sin eso no puedo ver el HTML que usas para agregar una fila.
    – phpMyGuel
    Commented el 5 feb. 2019 a las 14:55
  • Perdon el InputDinamico.php es la funciones multi y la parte del formulario, los dos ultimos fragmentes de codigo, gracis @PHPMyguel
    – Joe
    Commented el 5 feb. 2019 a las 15:01
  • Con la función load() estás cargando todo lo que tienes en InputDinamico.php dentro del elemento #productos esto puede dar lugar a tal número de errores que es imposible de determinar sin ver el fichero php por completo. Sin meterme de cabeza en ese lodazal podría decirte que aparentemente el problema que tienes está en que al llamar a la función que usas para agregar una fila, esta nueva fila genera elementos que tienen los mismos IDs que la anterior. Aunque yo que tú miraría tutoriales de como generar contenido dinámico porque me da que andas un poco perdido.
    – phpMyGuel
    Commented el 5 feb. 2019 a las 15:10

0

Tu Respuesta

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

Examina otras preguntas con la etiqueta o formula tu propia pregunta.