Επεξεργασία αγορών στον υπολογιστή προϊόντων

Ας υλοποιήσουμε τώρα την επεξεργασία των κελιών. Σύμφωνα με την προϋπόθεση, μπορούν να επεξεργαστούν μόνο τα πρώτα 3 κελιά.

Εδώ είναι αυτά:

createCell(tr, name.value, 'name');
createCell(tr, price.value, 'price');
createCell(tr, amount.value, 'amount');

Προφανώς, ο κώδικας για την επεξεργασία θα είναι πανομοιότυπος για κάθε κελί: στο διπλό κλικ αντί για το κείμενο του κελιού, θα πρέπει να εμφανιστεί ένα input, και με το πάτημα του Enter στο input το περιεχόμενό του θα πρέπει να γίνει το νέο κείμενο του κελιού.

Προτείνω να δημιουργήσουμε μια συνάρτηση που θα παίρνει ως παράμετρο ένα κελί του πίνακα και θα του δίνει τη δυνατότητα επεξεργασίας:

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, και επίσης να εκτελείται επανυπολογισμός του συνολικού ποσού.

Αυτή τη λεπτομέρεια θα την αφήσουμε ως επόμενη υπο-εργασία για επίλυση στο επόμενο μάθημα. Και για αρχή ας κάνουμε απλώς τη δυνατότητα επεξεργασίας των τριών μας κελιών, χωρίς επανυπολογισμό.

Υλοποιήστε την επεξεργασία κελιών που περιέγραψα.