Рэдагаванне пакупак у калькулятары прадуктаў
Давайце цяпер рэалізуем рэдагаванне ячаек.
Па ўмове рэдагаваць можна толькі першыя
3 ячэйкі.
Вось іх:
createCell(tr, name.value, 'name');
createCell(tr, price.value, 'price');
createCell(tr, amount.value, 'amount');
Відавочна, што код для рэдагавання будзе
аднолькавым для кожнай ячэйкі: па падвойным
кліку замест тэксту ячэйкі павінен з'явіцца
інпут, а па націску Enter у інпуце
яго змест павінен стаць новым тэкстам ячэйкі.
Я прапаную зрабіць некаторую функцыю, якая параметрам будзе прымаць ячэйку табліцы і прывязваць да яе магчымасць рэдагавання:
function allowEdit(td) {
td.addEventListener('dblclick', function() {
});
}
Тады мы можам прымяніць нашу функцыю наступным чынам:
allowEdit(createCell(tr, name.value, 'name'));
allowEdit(createCell(tr, price.value, 'price'));
allowEdit(createCell(tr, amount.value, 'amount'));
Уважны чытач можа заўважыць тое,
што не ўсе ячэйкі аднолькавыя: бо пры змене
ячэйкі з цаной або ячэйкі з колькасцю павінна
змяняцца кошт пакупкі ў калонцы cost,
а таксама выконвацца пераразлік агульнай сумы.
Гэты нюанс мы пакінем як наступную падзадачу для вырашэння ў наступным уроку. А для пачатку проста зробім магчымасць рэдагавання нашiх трох ячаек, без пераразліку.
Рэалізуйце апісанае мною рэдагаванне ячаек.