Foros aprenderaprogramar.com
Aprender a programar => Aprender a programar desde cero => Mensaje iniciado por: debybrusc en 03 de Enero 2017, 16:06
-
<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>
-
Hola debybrusc.
¿Podrías explicar cual es tu duda de una forma un poco mas clara?
No entiendo muy bien lo que necesitas.
Y si pudieras completar el código que falta, pues mejor.
Saludos. ;D
-
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;
}
-
Sigo sin saber que es lo que el código debe de hacer, pero en lo poco que muestras en esa última función, no es "getElementsByClass", sino "getElementsByClassName", esto lo puedes ver abriendo la consola del navegador, donde te dará un error.
Además de eso intentas guardar en la variable "total" los elementos que pertenezcan a la clase "totalitem" y en todo el código que pegaste no hay ni un solo elemento que tenga como clase "totalitem", así que la variable "total" no contendrá ningún elemento y no se ejecutará el "for" de esta función.
Saludos. ;D
-
Perdon! Soy nueva en esto!!!
Hay una parte del codigo q se ve q no se copio... falta la parte cuando me carga los td de la tabla (uno de esos td tiene la class 'total item').
En un ratito ingreso y copio el codigo completo!
Muchas gracias!!!!
-
<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>
-
Prueba con esto:
function ReCalcular(ele){
var nodoTotalItem = document.getElementsByClassName('totalitem');
var suma = 0;
for(var i = 0; i < nodoTotalItem.length; i ++) {
suma += Number(nodoTotalItem[i].value);
}
alert(suma);
}
Ten en cuenta que la fila en la que pulsas el botón, la elimina, por lo cual no se tiene en cuenta a la hora de calcular la suma de los elementos que tienen como clase "totalitem".
Saludos. ;D
-
Con el codigo como me lo enviaste no efectua ningun cambio, es decir! solo me pone un alert q es igual a Nan.
Modifique el codigo:
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
Te pongo una captura del error!
-
La variable total no contiene nada, añade esta línea en esa función:
var total = document.getElementById('total');
-
Asi decis?
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;
}
}
Sigue iguaaal! :'(
Tengo un merengue en la cabeza ya!
-
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);
}
total.innerHTML = suma;
}
Si no te he entendido mal es eso lo que debe de hacer la función, sumar todos los elementos que tengan como clase "totalitem".
-
Si!!! Ahora siiii!!!
MUCHAS GRACIAS PEDRO!!! :) :) :)