Exercice 1 :
Une entreprise spécialisée dans les appareils électroménagers a conçu le formulaire «
[Link] » pour permettre à ses clients de régler facilement leurs factures en ligne.
a- Ces figures représentent les codes HTML, CSS, JS développées afin de connecter à l’espace
payement
[Link]
onblur Se produit lorsque l'élément perd le focus
onclick Se produit lors d'un clic sur l'élément
onfocus Se produit lorsque l'élément reçoit le focus
oninput Se produit lors d'un changement de valeur
onload Se produit lorsque la page ou l'élément est chargé
onplay Se produit lorsque la lecture d'un élément multimédia commence
onpause Se produit lorsque la lecture d'un élément multimédia est mise en pause
onsubmit Se produit lorsqu'un formulaire est soumis
onchange Se produit lorsque la valeur d'un élément de formulaire change
1
[Link]
propriété CSS overflow; qui spécifie le comportement du
contenu lorsqu'il déborde de la boîte d'un élément
visible: Le contenu débordant est visible
hidden; Le contenu débordant est masqué
clip ;Semblable à hidden, sans événements
scroll; Barres de défilement ajoutées toujours
auto; Barres de défilement ajoutées si nécessaire
propriete CSS filter:
blur(px) : Applique un flou avec des unités en pixels.
grayscale(%) : Convertit en niveaux de gris avec des valeurs en %.
invert(%) : Inverse les couleurs avec des valeurs en pourcentage.
Rq;filter: invert(); /* Inversion des couleurs à 100% */
2
[Link]
Travail demandé :
I- HTML
Compléter (sur la figure de la page « [Link] » en respectant ces règles :
• Il faut prendre en considération lors de remplissage de la page qu’elle est liée avec une
feuille de styles ([Link]), un script JS([Link]) qui contient toutes les fonctions
appelés ,
• Dès le chargement de la page les champs mois et année seront remplis par le mois et
l’année courants (on utilisant la fonction « remplirAnneeMois() » développée dans
[Link] »)
• Si le champs nom perd le focus la fonction verifierNom() sera appelée et affiche un
message d’erreur dans la zone output.
• En cliquant sur le bouton envoyer la fonction payementForm() sera appelée.
• On souhaite ajouter la figure suivante dans la dernière ligne du formulaire
3
Le nom d’image est [Link] ayant comme légende « payement en ligne »
Compléter le code nécessaire pour effectuer cette tache
<img src="[Link]" alt="payement en ligne" id="imgPay">
II- CSS
Compléter la page [Link] afin de :
• Couper le débordement du paragraphe p en ajoutant une barre de défilement
horizontale.
• Ajouter à ce paragraphe une marge extérieure de 10px et une marge intérieure de 20px
• Les bordures des champs de formulaire seront supprimées lors du survol de la souris
• Inverser les couleurs de l’image lors de survol de la souris
III- javaScript
Compléter sur la figure [Link] :
• la fonction alpha(x) qui permet de vérifier si une chaine x est alphabétique ou non .
• la fonction verifierNom() qui permet de vérifier le nom puis affiche dans le champs output le
message « vérifier votre nom » si le nom n’est pas valide ou cache le message s’il est valide
• la fonction remplirAnneeMois() afin de remplir les champs mois et année par le mois et l’année
courants.
IV- BASE DE DONNEES
Partie A
Le responsable du SAV (Service après-vente) d’une entreprise d’électroménager a mis en place une petite
base de données afin de gérer les interventions de ces techniciens. Le modèle relationnel à la source de
cette base de données est le suivant :
Client (codecl, nomcl, prenomcl, adresse, cp, ville)
Produit (reference, désignation, prix)
Techniciens (codetec, nomtec, prenomtec, tauxhoraire)
Intervention (numero, dateinte, raison, codecl #, référence #, codetec #)
Ci-joint un tableau de description pour la base de données
attribut type description contrainte
Codecl Entier (auto incrémentée) Identifiant unique du client
nomcl Chaine de 20 caractères Nom du client obligatoire
prenomcl Chaine de 20 caractères Prenom du client obligatoire
adresse Chaine de 255 caractères Adresse du client obligatoire
cp Entier de taille 4 Code postal du client Entre 1000 et 9000
Ville Chaine de 255 caractères Ville du client obligatoire
reference entier(auto incrémentée) Identifiant unique du produit
désignation Chaine de 255 caractères Nom ou désignation du produit obligatoire
Prix Decimal(10,2) Prix du produit >0
codetec Entier (auto incrémentée) Identifiant unique de technicien
4
nomtec Chaine de 255 caractères Nom du technicien obligatoire
prenomtec Chaine de 255 caractères Prenom du technicien obligatoire
tauxhoraire Entier Taux horaire du technicien obligatoire
numero entier(auto incrémentée) Identifiant unique de
l’intervention
dateinte Date Date d’intervention obligatoire
raison Chaine de 255 caractères Raison d’intervention
1- donner la requête SQL qui permet de modifier la table intervention pour s'assurer que la date de
l'intervention est par défaut la date courante
2- lors de l’ajout de client bouzidi Ali habitant à Jilma Sidi bouzid qui a comme code postal 9110
une erreur s’est produite, donner :
• la cause de cette erreur : ………………………………………………………………………………………………
• la contrainte non respectée :……..…………………………………………………………………………………
• En Tunisie, les codes postaux sont généralement compris entre 1000 et 9999 : donner la requête
SQL qui permet apporter les modifications nécessaires pour accepter ce client :
………………………………………………………………………………………………………………………………………..
3- Donner la commande SQL pour supprimer les interventions qui ont eu lieu il y a plus de 30 jours :
………………………………………………………………………………………………………………………………………………..
4- Donner la requête SQL pour ajouter à la table produit le produit" Climatiseur 12000 BTU
Inverter" qui a comme prix 2600 dt
………………………………………………………………………………………………………………………………………………………….
5- L’administrateur souhaite ajouter une table fournisseur contenant
champs Type et contrainte
idFournisseur Entier auto incrémenté (identifiant unique du fournisseur)
Nom fournisseur Varchar(20)
Et respectant ces règles
R1 : un fournisseur peut produire plusieurs produits
R2 : un produit est fourni par un seul fournisseur
• Donner les commandes SQL pour :
➢ Créer la table fournisseur :
……………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………
➢ Apporter les modifications sur la base de données s’ils existent afin de respecter les
règles (représenter les tables modifiés textuellement)
……………………………………………………………………………………………………..
……………………………………………………………………………………………………
6- Donner les commandes SQL pour afficher :
• Les noms des techniciens qui ont affecté des interventions par ordre alphabétiques des noms :
………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………………
• La liste des interventions (numero) dont la raison d'intervention est indiquée.
…………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………..
5
………………………………………………………………………………………………………………………………..
• Afficher le nombre des interventions pour le dernier produit inséré dans la table produit
………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………
…………………………………………………………………………………………………………………………………
• Le nombre d’intervention par codetec techniciens.
………………………………………………………………………………………………
………………………………………………………………………………………………
………………………………………………………………………………………………
………………………………………………………………………………………………
• Les interventions (numero,date effectuées par le technicien : ‘gafsi ali’ en mois août 2024.
………………………………………………………………………………………………
………………………………………………………………………………………………
………………………………………………………………………………………………
………………………………………………………………………………………………
• La liste des techniciens (codetec, nomtec,prenomtec)qui ont un taux horaire > moyenne des taux
horaire.
…………………………………………………………………………………………………………………………………………………………
…………………………………………………………………………………………………………………………………………………………
…………………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………..
• Le nombre d'intervention par produit (reference ,designation) qui dépasse 2 interventions
…………………………………………………………………………………………………………………………………………………………
…………………………………………………………………………………………………………………………………………………………
…………………………………………………………………………………………………………………………
• Par ailleurs le produit référencé 123 a vu augmenter son prix de 20%, donner la requête SQL qui
répond à ce besoin :
………………………………………………………………………………………………
………………………………………………………………………………………………
………………………………………………………………………………………………
………………………………………………………………………………………………
Partie B
Suite à une modification de la loi de finances, le législateur tunisien exige que chaque client soit assuré par
la société. Pour cela l’administrateur ajoute une table
Agence_Assurance (id_agence,location)
Et a mis ces régles de gestion :
R3-un client peut avoir des contrats avec plusieurs agences
R4- une agence peut assurer plusieurs clients
1- Donner la nouvelle représentation textuelle de la base de données afin de répondre à ces
règles (justes les modifications)
6
……………………………………………………………………………
………………………………………………………………………….
………………………………………………………………………
2- Il s’est avéré qu’un client peut avoir plus qu’un contrat avec une seule agence dans des
dates différentes
Donner la commande SQL qui permet d’application cette modification.
………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………..