Buenos días,
Tengo un problema con un script de jQuery, pero no localizo el error. Les explico:
Tengo un formulario en el cuál se agregan dinámicamente campos para incluir información en un pedido:
Código HTML:
<input type="hidden" name="items[0]" id="items[0]" class="items" value="0">
<input type="text" name="setProducto[0]" id="setProducto[0]" class="input-type-det-e" value="" placeholder="Producto/ Servicio" >
<input type="text" name="setCantidad[0]" id="setCantidad[0]" class="cantidad input-type-det-c" value="" placeholder="Cant">
<select name="setUnidad[0]" id="setUnidad[0]" class="input-type-det-c">
<option value="0">Unidad</option>
<?php while($rowSelectUnidades = mysqli_fetch_array($sqlSelectUnidades, MYSQLI_ASSOC)) { ?>
<option value="<?php echo $rowSelectUnidades['id_unidad']; ?>"><?php echo utf8_encode($rowSelectUnidades['uds_unidad']); ?></option>
<?php } mysqli_free_result($sqlSelectUnidades); ?>
</select>
<input type="text" name="setDescuento[0]" id="setDescuento[0]" class="desc input-type-det-c" value="0.00" placeholder="Desc">
<select name="setExento[0]" id="setExento[0]" class="exento input-type-det-d">
<option value="Normal">Normal</option>
<option value="Exento">Exento</option>
</select>
<input type="text" name="setImporte[0]" id="setImporte[0]" class="suma input-type-det-c" value="" placeholder="P.U.">
<label><a id="agregarCampo2" class="btn btn-info" href="#" title="AGREGAR">[+]</a></label> y con este script, calculo el importe total del pedido:
Código Javascript
:
Ver original$("#calcular").click( function(e){
var importes = new Array();
var cantidad = new Array();
var descuento = new Array();
var exento = new Array();
var i = 0;
$(".suma").each(
function(index, value) {
importes[i] = eval($(this).val());
i++;
}
);
var j = 0;
$(".cantidad").each(
function(index, value) {
cantidad[j] = eval($(this).val());
j++;
}
);
var k = 0;
$(".desc").each(
function(index, value) {
descuento[k] = eval($(this).val());
k++;
}
);
var l = 0;
$(".exento").each(
function(index, value) {
if($(this).val() == 'Normal') {
exento[l] = 1.16;
} else {
exento[l] = 0;
}
l++;
}
);
var subtotal_pedido = 0;
var total_pedido = 0;
var total_iva = 0;
for(i=0; i<importes.length; i++ ){
importe = ((importes[i] * cantidad[i]) - descuento[i]);
subtotal_pedido = subtotal_pedido + (((importes[i] * cantidad[i]) - descuento[i]));
if(exento[i] > 0) {
iva = (importe * exento[i]) - importe;
} else {
iva = 0;
}
total_iva = total_iva + iva;
}
total_pedido = subtotal_pedido + total_iva;
alert('Subtotal: ' + subtotal_pedido + ' Iva: ' + total_iva + ' Total: ' + total_pedido);
});
Funciona muy bien, sin problemas, sin embargo:
Todo el primer formulario, sirve para ingresar artículos de forma personalizada, es decir, escribes el nombre del artículo, la cantidad, el precio, etc., el siguiente formulario es para artículos previamente dados de alta en un catálogo, los cuales ya incluyen el precio y el nombre del artículo:
Código HTML:
<select name="producto[0]" id="p_0" class="articulos input-type-det-b">
<option value="0">Producto/ Servicio</option>
<?php while($rowSelectProductos = mysqli_fetch_array($sqlSelectProductos, MYSQLI_ASSOC)) { ?>
<option value="<?php echo $rowSelectProductos['id_catalogo']; ?>" data-target="<?php echo $rowSelectProductos['cat_precio_unitario']; ?>">
<?php echo $rowSelectProductos['cat_titulo'] . ' | $' . number_format($rowSelectProductos['cat_precio_unitario'], 2); ?>
</option>
<?php } mysqli_free_result($sqlSelectProductos); ?>
</select>
<input type="text" name="cantidad[0]" id="c_0" class="cantidades input-type-det-c" value="" placeholder="Cant">
<input type="text" name="descuento[0]" id="d_0" class="descuentos input-type-det-c" value="0.00" placeholder="Desc">
<select name="exento[0]" id="e_[0]" class="exentos input-type-det-d">
<option value="Normal">Normal</option>
<option value="Exento">Exento</option>
</select>
<label><a id="agregarCampo" class="btn btn-info" href="#" title="AGREGAR">[+]</a></label> entonces, para calcular este catálogo uso la misma instrucción de jQuery arriba mencionada, obviamente sólo cambiando los nombres de las clases:
Código Javascript
:
Ver original// Cálculo de factura por catálogo
$("#calcular2").click( function(e){
var importes2 = new Array();
var cantidad2 = new Array();
var descuento2 = new Array();
var exento2 = new Array();
alert("llego");
var i = 0;
$(".articulos").each(
function(index, value) {
importes2[i] = eval($(this).val());
i++;
alert(importes2[i]);
}
);
});
y es aquí donde vienen los problemas... por ejemplo en la función donde se obtienen los artículos (.articulos), me marca como indefinido importes2[i], no me trae los valores. Si la variable la configuro no como un arreglo si me trae esos valores, pero yo la necesito como arreglo. Y esto me sucede con los demás campos (clases cantidades, descuentos, exentos) de este formulario.
Llevo un rato tratando de identificar el porqué, pero aún no lo logro :/
Ahora, por otro lado, una vez trayendo los valores, en importes2[i] = eval($(this).val()); no me interesa obtener el valor que tiene el value del input, sino el texto que contienen los options, esto es porque ahí vienen los precios de los artículos.
Ya revisé algunos métodos en internet, pero no me funcionan cuando traigo campos dinámicamente, sólo lo obtienen si es un campo fijo.
Estos son los botones para realizar el cálculo:
Código HTML:
<input type="button" name="calcular" id="calcular" value="Calcular" >
<input type="button" name="calcular2" id="calcular2" value="Calcular" >
No sé si me expliqué bien con todo esto, de todas formas les agradezco por sus comentarios.
Saludos!!