პროდუქტების კალკულატორში შესყიდვების რედაქტირება
ახლა მოდით განვახორციელოთ უჯრების რედაქტირება.
პირობის მიხედვით, რედაქტირება მხოლოდ პირველი
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 სვეტში,
და ასევე უნდა მოხდეს მთლიანი თანხის ხელახალი გამოთვლა.
ამ ნიუანსს ჩვენ დავტოვებთ, როგორც შემდეგ დასახული ქვეამოცანის ამოხსნას მომდევნო გაკვეთილისთვის. თავიდან კი უბრალოდ გავაკეთოთ ჩვენი სამი უჯრის რედაქტირების შესაძლებლობა, ხელახალი გამოთვლების გარეშე.
განახორციელეთ ჩემს მიერ აღწერილი უჯრების რედაქტირება.
