Edición con recálculo en la calculadora de productos en JavaScript
Ahora mejoremos la función allowEdit
para que realice el recálculo descrito en la
lección anterior.
En este momento, el código de tu función debería verse aproximadamente así:
function allowEdit(td) {
td.addEventListener('dblclick', function() {
let text = td.textContent
td.textContent = '';
let input = document.createElement('input');
input.value = text;
input.focus();
td.appendChild(input);
input.addEventListener('keydown', function(event) {
if (event.key == 'Enter') {
td.textContent = this.value;
}
});
});
}
Agreguemos código que realizará el recálculo para la celda con el precio y para la celda con la cantidad:
function allowEdit(td) {
td.addEventListener('dblclick', function() {
let text = td.textContent
td.textContent = '';
let input = document.createElement('input');
input.value = text;
input.focus();
td.appendChild(input);
input.addEventListener('keydown', function(event) {
if (event.key == 'Enter') {
td.textContent = this.value;
if (td.classList.contains('price') || td.classList.contains('amount')) {
// realizar el recálculo
}
}
});
});
}
Complete la parte faltante del código para que
al cambiar la celda con el precio o la celda con
la cantidad, cambie el costo de compra
en la columna cost, y también se realice
el recálculo del total.
