Modifica con ricalcolo nel calcolatore di prodotti in JavaScript
Ora perfezioniamo la funzione allowEdit
in modo che venga eseguito il ricalcolo
descritto nella lezione precedente.
A questo punto, il codice della tua funzione dovrebbe assomigliare a questo:
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;
}
});
});
}
Aggiungiamo il codice che per la cella con il prezzo e per la cella con la quantità eseguirà il ricalcolo:
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')) {
// eseguiamo il ricalcolo
}
}
});
});
}
Completate la parte mancante del codice in modo che
quando si modifica la cella con il prezzo o la cella con la
quantità, cambi il costo dell'acquisto
nella colonna cost, e venga anche
eseguito il ricalcolo dell'importo totale.