Utilisation de la msgBox

Jusqu’aujourd’hui, la fonction msgBox() se servait de la fonction openModal() et de la div#modal qui lui était associée. Il y avait également un fichier msgBox.xml et msgBox.asp qui entraient dans le processus.

La msgBox est désormais complètement indépendant de la modale, et entièrement développée en Javascript, sans appel Ajax. Les fichiers asp et xml on donc été archivés. La seule chose à retenir côté front, c’est que si nous changeons la présentation de la div#modal, il faudra le faire également pour la div#msgBox, puisqu’il s’agit de deux div différentes (se trouvant dans Interface).

J’en ai profité pour ajouter la gestion des boutons. Il est désormais possible de savoir si on a appuyé sur OK ou sur Annuler afin d’effectuer le traitement correspondant au bouton pressé.

Rappel du processus #

Contrairement aux fonctions intégrées dans JavaScript, telles que alert() et confirm et prompt, Javascript n’arrête pas le programma après l’ouverture d’une modale. Ce qui signifie que ces deux programmes ne fonctionnent pas de la même façon :

alert("Veuillez cliquer sur OK pour continuer");
window.location.href = "suite.asp";

msgBox("Opération terminée", "Veuillez cliquer sur OK pour continuer", "OK")
window.location.href = "suite.asp";

Dans le premier cas, le script s’interrompt jusqu’à ce que l’utilisateur clique sur OK, alors que dans le deuxième cas, la modale s’affiche puis le script continue (on voit à peine la modale s’afficher et suite.asp est exécuté). Ceci signifie que si nous voulons utiliser msgBox() à la place d’alert(), notre processus doit être coupé en deux :

1. Un premier processus qui s’arrête juste après msgBox()
2. La suite du processus qui doit être exécuté lorsqu’on clique sur un bouton de la msgBox.

La fonction afterModalClose() #

Nous avons prédéveloppé le processus qui se charge d’intercepter les clicks et de fournir des informations relatives au traitement à effectuer. Notre fonction préprogrammée effectue 3 tâches :

• Elle place « ok » ou « cancel » dans la variable buttonValue
• Elle ferme la fenêtre msgBox
• Elle exécute la fonction afterModalClose()

afterModalClose() devrait donc avoir la forme suivante :

function afterModalClose() {
  if (buttonValue == "ok") {
    // Faire quelque chose si l'utilisateur a cliqué sur "OK"
  } else {
    // Faire quelque chose si l'utilisateur a cliqué sur le bouton "Annuler"
  }
}

Dans notre exemple, ceci suffirait :

function afterModalClose() {
  if (buttonValue == "ok") {
    window.location.href = "suite.asp";
  }
}

Paramètres relatifs à l’action #

Dans certains cas, afterModalClose() peut avoir besoin de paramètres. La solution préconiséé (pour des raisons d’élégance syntaxique) est d’envoyer ces paramètres lors de l’appel de la msgBox.

Par exemple, si vous avez besoin de la variable idInvestigateur, l’appel de la fonction msgBox() peut être fait avec un cinquième argument comme ceci :

msgBox("Opération irréversible",
 "Cliquez sur EFFACER pour supprimer définitivement cet investigateur",
 "EFFACER",
 "Annuler",
 idInvestigateur
)

La valeur de la variable idInvestigateur est ensuite exploitable dans la fonction afterModalClose, grâce à la variable modalParameter  :

function afterModalClose() {
  if (buttonValue == "ok") {
    window.location.href = "supprimerInvestigateur.asp?id=" + modalParameter;
  }
}