estoy tratando de convertir los valores de los input que son numeros en decimales pero la funcion activeElement no me obtiene los valores del input activo y me da un error, espero que me puedan ayudar o sujerirme otro modo de hacerlo,
$(document).ready(function () {
$("#nuevoServicio").click(function () {
var tableReg = document.getElementById("tablaserviciosprest");
$("#tablaserviciosprest").append("<tr>" + tableReg.rows[1].innerHTML + "</tr>");
$('.eliminalinea').off().click(function (e) {
$(this).parent('td').parent('tr').remove(); });
addcambios()
});
addcambios()
});
function addcambios() {
//token
function getCookie(name) {
var cookieValue = null;
if (document.cookie && document.cookie !== '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]);
if (cookie.substring(0, name.length + 1) === (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
var csrftoken = getCookie('csrftoken');
//tokenn
function parseFloatHTML(element) {
return parseFloat(element.innerHTML.replace(/[^\d\.\-]+/g, '')) || 0;
}
function parsePrice(number) {
return number.toFixed(2).replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1,');
}
function updateNumber(e) {
console.log(document.activeElement);
var
activeElement = document.activeElement,
value = parseFloat(activeElement.innerHTML),
wasPrice = activeElement.innerHTML == parsePrice(parseFloatHTML(activeElement));
if (!isNaN(value) && (e.keyCode == 38 || e.keyCode == 40 || e.wheelDeltaY)) {
e.preventDefault();
value += e.keyCode == 38 ? 1 : e.keyCode == 40 ? -1 : Math.round(e.wheelDelta * 0.025);
value = Math.max(value, 0);
activeElement.innerHTML = wasPrice ? parsePrice(value) : value;
}
document.addEventListener('mousewheel', updateNumber);
document.addEventListener('keyup', updateNumber);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet"/>
<form role="form" action="" method="post" class="form-horizontal">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">x</button>
<h3>Adicionar Servicio Prestado</h3>
</div>
<div class="modal-body ">
<div class="panel panel-default ">
<div class="panel-body 2">
<div class="form-group">
<label for="areaSP" class="control-label col-lg-1">Área*:</label>
<div class="col-lg-4">
<select class="form-control" id="areaSP" name="areaT">
<option value="">Seleccione Área ...</option>
{% for area in area_List %}
<option value="{{ area.pk }}">{{ area.area }}</option>
{% endfor %}
</select>
</div>
</div>
<div class="form-group">
<label for="clienteSP" class="control-label col-lg-1">Cliente*:</label>
<div class="col-lg-6">
<select class="form-control" id="clienteSP" name="areaT">
<option value="">Seleccione Cliente ...</option>
{% for cliente in cliente_List %}
<option value="{{ cliente.pk }}">{{ cliente.nombreEmp }}</option>
{% endfor %}
</select>
</div>
</div>
<div class="form-group">
<label for="carnetI" class="control-label col-lg-2">Servicios Prestados*:</label>
<div class="col-xs-offset-1 col-lg-11">
<table class="table table-bordered" id="tablaserviciosprest">
<thead>
<tr>
<th>Área</th>
<th>Servicio</th>
<th>Precio CUP</th>
<th>Precio CUC</th>
<th>Precio Total</th>
<th>Cantidad</th>
<th>Costo Total</th>
<th>Opciones</th>
</tr>
</thead>
<tbody>
<tr style="display:none; ">
<td class="col-lg-2">
<select id="seleccionarArea[]"
class="select2_single form-control select2-hidden-accessible seleccionarArea"
name="seleccionarArea[]">
<option value="">Seleccione Área ...</option>
<option value="1">Comercio</option>
<option value="2">Aplicaciones Informáticas</option>
<option value="3">Desarrollo</option>
</select>
</td>
<td class="col-lg-2">
<select id="seleccionarServicioP[]"
class="select2_single form-control select2-hidden-accessible seleccionarServicioP"
name="seleccionarServicioP[]" disabled="">
<option value="">Seleccione Servicio ...</option>
</select>
</td>
<td><input type="text" id="precioCUP" name="precioCUP[]" placeholder="CUP"
class="form-control">
</td>
<td><input type="text" id="precioCUC" name="precioCUC[]" placeholder="CUC"
class="form-control"></td>
<td><input type="text" id="precioTotal" name="precioTotal[]" class="form-control"
placeholder="Total"></td>
<td><input type="text" id="cantidad" name="cantidad[]" class="form-control"
placeholder="Cantidad"></td>
<td><input type="text" id="costoTotal" name="costoTotal[]" class="form-control"
placeholder="Total"></td>
<td>
<button type="button" class="eliminalinea btn btn-default btn-xs col-lg-offset-4">
<span class="glyphicon glyphicon-minus " style="color: red"></span></button>
</td>
</tr>
<tr>
<td class="col-lg-2">
<select id="seleccionarArea[]"
class="select2_single form-control select2-hidden-accessible seleccionarArea"
name="seleccionarArea[]">
<option value="">Seleccione Área ...</option>
<option value="1">Comercio</option>
<option value="2">Aplicaciones Informáticas</option>
<option value="3">Desarrollo</option>
</select>
</td>
<td class="col-lg-2">
<select id="seleccionarServicioP[]"
class="select2_single form-control select2-hidden-accessible seleccionarServicioP"
name="seleccionarServicioP[]" disabled>
<option value="">Seleccione Servicio ...</option>
</select>
</td>
<td><input type="text" id="precioCUP[]" name="precioCUP[]" placeholder="CUP"
class="form-control">
</td>
<td><input type="text" id="precioCUC[]" name="precioCUC[]" placeholder="CUC"
class="form-control"></td>
<td><input type="text" id="precioTotal[]" name="precioTotal[]" class="form-control"
placeholder="Total"></td>
<td><input type="text" id="cantidad[]" name="cantidad[]" class="form-control"
placeholder="Cantidad"></td>
<td><input type="text" id="costoTotal[]" name="costoTotal[]" class="form-control"
placeholder="Total"></td>
<td>
<button type="button" class="eliminalinea btn btn-default btn-xs col-lg-offset-4" disabled>
<span class="glyphicon glyphicon-minus " style="color: red"></span></button>
</td>
</tr>
</tbody>
</table>
<button type="button" id="nuevoServicio" class="btn btn-danger nuevoServicio">Nuevo Servicio
</button>
</div>
</div>
<div class="form-group">
<label for="porCobrar" class="control-label col-lg-2">Por Cobrar:</label>
<div class="checkbox col-lg-7">
<input id="porCobrar" name="porCobrar" type="checkbox" checked>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<div class="col-lg-12 text-right">
<button type="submit" class="btn btn-primary" name="submit">Guardar</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
</div>
</div>
</form>