Ver Mensaje Individual
  #1 (permalink)  
Antiguo 15/07/2016, 15:50
LABANDADELOSO
 
Fecha de Ingreso: octubre-2012
Mensajes: 74
Antigüedad: 11 años, 7 meses
Puntos: 0
Problema con script al intentar modificar datos traidos desde la base de datos

Hola a todos,

Tengo una script que me permite agregar campos dinamicamente, y a su vez me muestra el resultado de estos.

Código:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
 
<script>
function define()
{
    $("#add").unbind().click(function() {       
        var intId = $("#buildyourform div").length + 1;
        var fieldWrapper = $("<div class=\"products\" id=\"field" + intId + "\"/>");
        var fName = $("<input type=\"text\" id=\"val0\" name=\"data[Product]["+ intId +"][nombre]\" class=\"form-control\" placeholder=\"Detalle del producto\" style=\"width:30%;\" />");
        var fType = $("<input type=\"text\" id=\"val1\" name=\"data[Product]["+ intId +"][cantidad]\" class=\"form-control\" placeholder=\"Cantidad\" style=\"width:20%;\" />");
        var fType2 = $("<input type=\"text\" id=\"val2\" name=\"data[Product]["+ intId +"][precio]\" class=\"form-control\" placeholder=\"Valor\" style=\"width:20%;\" />");
        var removeButton = $("<input type=\"button\" class=\"btn btn-danger btn-fill\" style=\"width:15%;\" value=\"Eliminar\" />");
 
        removeButton.click(function() {
            $(this).parent().remove();
        });
 
        fieldWrapper.append(fName);
        fieldWrapper.append(fType);
        fieldWrapper.append(fType2);
        fieldWrapper.append(removeButton);
        $("#buildyourform").append(fieldWrapper);
        define();
    });
 
  $(".products input").keyup(multInputs);
 
  function multInputs() {
    var neto = 0;
    var iva = 0;
    var total = 0;
    // for each row:
    $(".products").each(function () {
      // get the values from this row:
      var $val1 = $('#val1', this).val();
      var $val2 = $('#val2', this).val();
      var $total = ($val1 * 1) * ($val2 * 1)
      $('.total',this).text($total);
      neto += $total;
      iva = neto * 0.19;
      total = neto + iva;
    });

    var neto = neto;
    if(!isNaN(neto)){
        neto = neto.toString().split('').reverse().join('').replace(/(?=\d*\.?)(\d{3})/g,'$1.');
        neto = neto.split('').reverse().join('').replace(/^[\.]/,'');
        $(".neto").text(neto);   
    }

    if(!isNaN(iva)){
        iva = iva.toString().split('').reverse().join('').replace(/(?=\d*\.?)(\d{3})/g,'$1.');
        iva = iva.split('').reverse().join('').replace(/^[\.]/,'');
        $(".iva").text(iva);   
    }

    if(!isNaN(neto)){
        total = total.toString().split('').reverse().join('').replace(/(?=\d*\.?)(\d{3})/g,'$1.');
        total = total.split('').reverse().join('').replace(/^[\.]/,'');
        $(".total").text(total);   
    }

  }

}
$(document).ready(function() {
  define();
});
</script>
<div class="row">
    <div class="col-md-12">
    <div class="form-group" id="buildyourform">
      <div class="products">
        <input type="text" name="data[Product][0][nombre]" class="form-control" placeholder="Detalle del producto" style="width:30%;" />
        <input type="text" id="val1" name="data[Product][0][cantidad]" class="form-control" placeholder="Cantidad" style="width:20%;" />
        <input type="text" id="val2" name="data[Product][0][precio]" class="form-control" placeholder="Valor" style="width:20%;" />
        <input type="button" value="Agregar" class="btn btn-info btn-fill" id="add" />
      </div>
    </div>
  </div>
</div>

<table class="table table-hover table-striped">
                                    <tbody>
                                        <tr>
                                            <td>NETO</td>
                                            <td><strong>$ </strong><span class="neto"></span></td>
                                        </tr>
                                        <tr>
                                            <td>IVA</td>
                                            <td><strong>$ </strong><span class="iva"></span></td>
                                        </tr>
                                        <tr>
                                            <td>TOTAL</td>
                                            <td><strong>$ </strong><span class="total"></span></td>
                                        </tr>
                                    </tbody>
                                </table>
Hasta aquí todo bien, el problema se me presenta al traer los datos ingresados desde la base de datos para poder editarlos.
Tengo los siguientes problemas:
1.- No me arroja los cálculos, hasta que realizo alguna modificación
2.- Al agregar una nueva fila, me genera el calculo, pero al eliminar la linea, se sigue manteniendo los valores en el total.

Agradecería cualquier ayuda.

Saludos.