1
Aprender a programar desde cero / Re:Recacular total con array al efectuar OnClick="Delete" button
« en: 04 de Enero 2017, 13:48 »
Si!!! Ahora siiii!!!
MUCHAS GRACIAS PEDRO!!!
MUCHAS GRACIAS PEDRO!!!
![Sonrisa :)](https://aprenderaprogramar.com/foros/Smileys/default/smiley.gif)
![Sonrisa :)](https://aprenderaprogramar.com/foros/Smileys/default/smiley.gif)
![Sonrisa :)](https://aprenderaprogramar.com/foros/Smileys/default/smiley.gif)
Aprende Java con el libro "Aprender a programar en Java desde cero. Curso paso a paso." Editorial aprenderaprogramar. com. 200 pgs. Disponible en papel y ebook.
Esta sección te permite ver todos los posts escritos por este usuario. Ten en cuenta que sólo puedes ver los posts escritos en zonas a las que tienes acceso en este momento.
function ReCalcular(ele){
var totalitem = document.getElementsByClassName('totalitem');
var total = document.getElementById('total');
var suma = 0;
for(var i = 0; i < totalitem.length; i ++) {
suma += Number(totalitem[i].value);
if (total.innerHTML == 'NaN') {
total.innerHTML = 0;
}
total.innerHTML = parseFloat(total.innerHTML)+totalitem;
}
}
function ReCalcular(ele){
var totalitem = document.getElementsByClassName('totalitem');
var suma = 0;
for(var i = 0; i < totalitem.length; i ++) {
suma += Number(totalitem[i].value);
if (total.innerHTML == 'NaN') {
total.innerHTML = 0;
}
total.innerHTML = parseFloat(total.innerHTML)+totalitem;
}
}
//SIGUE SIN EFECTUAR EL CALCULO
<script>
$( document ).ready(function() {
$( "input, textarea" ).focus(function() {
$( "input, textarea" ).next( ".info" ).hide();
$( this ).next( ".info" ).show();
});
});
</script>
<script type="text/javascript">
function AddItem() {
var tbody = null;
var tabla = document.getElementById("tabla");
var nodes = tabla.childNodes;
for (var x = 0; x<nodes.length;x++) {
if (nodes[x].nodeName == 'TBODY') {
tbody = nodes[x];
break;
}
}
if (tbody != null) {
var tr = document.createElement('tr');
tr.innerHTML = '<td><input type="text" name="Numero[]"/></td><td><input type="text" name="Codigo Catalogo[]"/></td><td><input type="text" name="Descripcion[]"/></td><td><input type="text" name="UM[]"/></td><td><input type="text" name="cantidad[]" onChange="Calcular(this);" value="1" /></td><td><input type="text" name="precunit[]" onChange="Calcular(this);" value="0"/></td><td><input type="text" name="totalitem[]" class="totalitem" readonly /></td><td><button type="button" value="Delete Row" onClick="Deletebtn(this); ReCalcular(this);" class="btn btn-danger delete"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></td>';
//ACA DEFINO AL TD LA CLASS "TOTAL ITEM"
tbody.appendChild(tr);
}
}
function Calcular(ele) {
var cantidad = 0, precunit = 0, totalitem = 0;
var tr = ele.parentNode.parentNode;
var nodes = tr.childNodes;
for (var x = 0; x<nodes.length;x++) {
if (nodes[x].firstChild.name == 'cantidad[]') {
cantidad = parseFloat(nodes[x].firstChild.value,10);
}
if (nodes[x].firstChild.name == 'precunit[]') {
precunit = parseFloat(nodes[x].firstChild.value,10);
}
if (nodes[x].firstChild.name == 'totalitem[]') {
totalitem = parseFloat((precunit*cantidad),10);
nodes[x].firstChild.value = totalitem;
}
}
var total = document.getElementById("total");
if (total.innerHTML == 'NaN') {
total.innerHTML = 0;
}
total.innerHTML = parseFloat(total.innerHTML)+totalitem;
}
</script>
<script type="text/javascript">
function Deletebtn(btndel) {
if (typeof(btndel) == "object") {
$(btndel).closest("tr").remove();
} else {
return false;
}
}
//ESTA PARTE NO REALIZA LO Q QUIERO = SUMAR TODOS LOS DATOS Q TOMA CON UN ARRAY DE LA COLUMNA TOTAL DE CLASS "TOTAL ITEM"
function ReCalcular(ele){
alert('hola!');
</script>
</head>
<body>
<div class="container">
<form class="form-horizontal" method="post" title="Bienes solicitados">
<!-- ACA INICIA MI CODIGO -->
<div class="panel panel-default">
<div class="panel-body"><b>BIENES Y SERVICIOS SOLICITADOS:</b>
<hr>
<div class="form-group">
<div class="col-md-12">
<div class="row">
<div class="col-md-12" align="center">
<form name="frmitems" id="frmitems">
<div id="contenedor">
<table id="tabla" class="col-md-12">
<thead>
<!-- HEADER DE LAS COLUMNAS -->
<tr>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon">Numero</th>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon">Codigo Catalogo</th>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon">Descripcion</th>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon">UM</th>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon">Cantidad</th>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon">Precio Unitario</th>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon">Total</th>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon"></th>
</tr>
</thead>
<tbody>
<!-- ACA SE AUTO INCREMENTAN LAS CELDAS -->
</tbody>
<tfoot>
<!-- FOOTER DE LA TABLA -->
</tfoot>
</table>
<hr>
<div>
<button type="button" onClick="AddItem();" class="btn btn-success" id="agregar-renglon" align="center"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true" align="center"></span></button>
</div>
</form>
<div class="input-group">
<div class="input-group-addon"><p>$
<span id="total"> 0</span></p>
</div>
</div>
<p></p>
<textarea class="form-control" rows="1" placeholder=""></textarea>
<div class="info" align="left">
<p>» (01) Consignar los datos respecto a del bien/servicio según figura en el catálogo SIByS. Este requisito es obligatorio para los requerimientos.</p>
<p>» (02) Consignar la moneda y el valor total de la solicitud de gastos en letras. Ej. PESOS CUARENTA Y CINCO MIL CON 00/100.</p>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</form>
</div>
</body>
</html>
function ReCalcular(ele){
alert('hola!');
//HASTA EL ALERT REALIZA TODO!
//ME FALTA HACER EL ARRAY Q RECORRA LOS ELEMENTOS POR CLASS 'TOTALITEM' Y ME SUME TODOS LOS INPUTS Q EL MISMO ARROJA!
//var total = document.getElementsByClass("totalitem");
//for( i = 0; i <= totalitem.length; i++){
//if (total.innerHTML == 'NaN') {
// total.innerHTML = 0;
//}
//total.innerHTML = parseFloat(total.innerHTML)+totalitem;
}
<script type="text/javascript">
$( document ).ready(function() {
$( "input, textarea" ).focus(function() {
$( "input, textarea" ).next( ".info" ).hide();
$( this ).next( ".info" ).show();
});
});
function AddItem() {
var tbody = null;
var tabla = document.getElementById("tabla");
var nodes = tabla.childNodes;
for (var x = 0; x<nodes.length;x++) {
if (nodes[x].nodeName == 'TBODY') {
tbody = nodes[x];
break;
}
}
if (tbody != null) {
var tr = document.createElement('tr');
tr.innerHTML = '<td><input type="text" name="Numero[]"/></td><td><input type="text" name="Codigo Catalogo[]"/></td><td><input type="text" name="Descripcion[]"/></td><td><input type="text" name="UM[]"/></td><td><input type="text" name="cantidad[]" onChange="Calcular(this);" value="1" /></td><td><input type="text" name="precunit[]" onChange="Calcular(this);" value="0"/></td><td><input type="text" name="totalitem[]" readonly /></td><td><button type="button" value="Delete Row" onClick="Deletebtn(this); ReCalcular(this);" class="btn btn-danger delete"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></td>';
tbody.appendChild(tr);
}
}
function Calcular(ele) {
var cantidad = 0, precunit = 0, totalitem = 0;
var tr = ele.parentNode.parentNode;
var nodes = tr.childNodes;
for (var x = 0; x<nodes.length;x++) {
if (nodes[x].firstChild.name == 'cantidad[]') {
cantidad = parseFloat(nodes[x].firstChild.value,10);
}
if (nodes[x].firstChild.name == 'precunit[]') {
precunit = parseFloat(nodes[x].firstChild.value,10);
}
if (nodes[x].firstChild.name == 'totalitem[]') {
totalitem = parseFloat((precunit*cantidad),10);
nodes[x].firstChild.value = totalitem;
}
}
var total = document.getElementById("total");
if (total.innerHTML == 'NaN') {
total.innerHTML = 0;
}
total.innerHTML = parseFloat(total.innerHTML)+totalitem;
}
function Deletebtn(btndel) {
if (typeof(btndel) == "object") {
$(btndel).closest("tr").remove();
} else {
return false;
}
}
//ESTA PARTE YA NO FUNCIONA
function ReCalcular(ele){
var cantidad = 0, precunit = 0, totalitem = 0;
var tr = ele.parentNode.parentNode;
var nodes = tr.childNodes;
for (var x = 0; x<nodes.length;x++) {
if (total.innerHTML == 'NaN') {
total.innerHTML = 0;
}
total.innerHTML = parseFloat(total.innerHTML)+totalitem;
}
}
</script>
</head>
<body>
<div class="container">
<form class="form-horizontal" method="post" title="Bienes solicitados">
<!-- ACA INICIA MI CODIGO -->
<div class="panel panel-default">
<div class="panel-body"><b>BIENES Y SERVICIOS SOLICITADOS:</b>
<hr>
<div class="form-group">
<div class="col-md-12">
<div class="row">
<div class="col-md-12" align="center">
<form name="frmitems" id="frmitems">
<div id="contenedor">
<table id="tabla" class="col-md-12">
<thead>
<!-- HEADER DE LAS COLUMNAS -->
<tr>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon">Numero</th>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon">Codigo Catalogo</th>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon">Descripcion</th>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon">UM</th>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon">Cantidad</th>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon">Precio Unitario</th>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon">Total</th>
<th class="col-md-8 col-xs-6 col-md-4 input-group-addon"></th>
</tr>
</thead>
<tbody>
<!-- ACA SE AUTO INCREMENTAN LAS CELDAS -->
</tbody>
<tfoot>
<!-- FOOTER DE LA TABLA -->
</tfoot>
</table>
<hr>
<div>
<button type="button" onClick="AddItem();" class="btn btn-success" id="agregar-renglon" align="center"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true" align="center"></span></button>
</div>
</form>
<div class="input-group">
<div class="input-group-addon"><p>$
<span id="total"> 0</span></p>
</div>
</div>
<p></p>
<textarea class="form-control" rows="1" placeholder=""></textarea>
<div class="info" align="left">
<p>» (01) Consignar los datos respecto a del bien/servicio según figura en el catálogo SIByS. Este requisito es obligatorio para los requerimientos.</p>
<p>» (02) Consignar la moneda y el valor total de la solicitud de gastos en letras. Ej. PESOS CUARENTA Y CINCO MIL CON 00/100.</p>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- PRINT PDF -->
<div class="clearfix"></div>
<div class="row">
<div class="col-md-12" align="center">
<a class="btn btn-primary"><span class="glyphicon glyphicon-print"></span></a></button>
</div>
</div>
</div>
</body>
</html>
Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.
Abraham Lincoln (1808-1865) Presidente estadounidense.
aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación