Pour créer un script JavaScript pour la gestion des accessoires pour les employés internes, nous pouvons utiliser une combinaison de HTML pour la structure de la page et JavaScript pour la logique et les interactions. Voici un exemple simple de code :
### HTML (index.html)
« `html
Gestion des Accessoires pour Employés Internes
| Nom de l’employé | Nom de l’accessoire | Quantité |
|---|
« `
### JavaScript (script.js)
« `javascript
document.addEventListener(‘DOMContentLoaded’, function() {
const form = document.getElementById(‘accessoryForm’);
const accessoryTable = document.getElementById(‘accessoryTable’).getElementsByTagName(‘tbody’)[0];
form.addEventListener(‘submit’, function(event) {
event.preventDefault();
const employeeName = document.getElementById(’employeeName’).value;
const accessoryName = document.getElementById(‘accessoryName’).value;
const quantity = document.getElementById(‘quantity’).value;
addAccessory(employeeName, accessoryName, quantity);
form.reset();
});
function addAccessory(employeeName, accessoryName, quantity) {
const newRow = accessoryTable.insertRow();
const cell1 = newRow.insertCell(0);
const cell2 = newRow.insertCell(1);
const cell3 = newRow.insertCell(2);
cell1.textContent = employeeName;
cell2.textContent = accessoryName;
cell3.textContent = quantity;
}
});
« `
### Explication
1. **HTML (index.html)**
– La structure de la page inclut un formulaire pour entrer le nom de l’employé, le nom de l’accessoire et la quantité.
– Une table est utilisée pour afficher les accessoires ajoutés pour les employés.
2. **JavaScript (script.js)**
– Une fois que le document est chargé (`DOMContentLoaded`), le script ajoute un événement de soumission (`submit`) au formulaire.
– Lorsque le formulaire est soumis, les valeurs des champs de saisie sont récupérées et une nouvelle ligne est ajoutée à la table avec ces valeurs.
– La fonction `addAccessory` gère l’ajout de la nouvelle ligne dans la table.
Ce code permet de gérer les accessoires pour les employés internes de manière simple et efficace.