Les boites de message - Cours Javascript

Introduction

Info

Les boîtes de message ou boites de dialogue permettent :
- d'alerter,
- de confirmer,
- de recevoir des informations.

Alerter

Définition alert()

La méthode javascript Alert(texte) permet d'avertir l'utilisateur en ouvrant un boite de dialogue avec un bouton "OK".



La méthode javascript Alert(texte) accepte comme argument :
- texte, valeur de type String qui correspond au texte à afficher dans la boite de dialogue.

On l'écrit :
Exemple de code :
alert('texte');

Exemple :
Exemple de code :
var m="mon texte";
alert(m);

Confirmer

Définition confirm()

La méthode javascript confirm(texte) permet d'avertir l'utilisateur en ouvrant un boite de dialogue avec deux choix "OK" ou "Annuler".



La méthode javascript confirm(texte) accepte comme argument :
- texte, valeur de type String qui correspond au texte à afficher dans la boite de dialogue.
La méthode javascript confirm() renvoie comme valeur :
- true, si on a cliqué sur "ok"
- false, si on a cliqué sur "Annuler"

On l'écrit :
Exemple de code :
confirm('texte');

On teste la valeur comme ceci :
Exemple de code :
if (confirm('texte')){
  //action à faire pour la valeur true
}else{
  //action à faire pour la valeur false
}

L'exemple ci-dessous montre une autre façon de faire.
Exemple :
Exemple de code :
var m="mon texte";
var confirmation=confirm("la valeur de m est :"+m);
if (confirmation){
  //action à faire pour la valeur true
}else{
  //action à faire pour la valeur false
}

Demander une information

Définition prompt()

La méthode javascript prompt(texte,saisie) permet de demander à l'utilisateur de nous donner une informations. La boite de dialogue est composé de deux bouton "OK" ou "Annuler" et une zone de saisie.



La méthode javascript prompt(texte,saisie) accepte comme arguments :
- texte, valeur de type String qui correspond au texte informatif à afficher dans la boite de dialogue.
- saisie, valeur de type String qui correspond au texte à afficher dans la zone de saisie de la boite de dialogue.
La méthode javascript prompt(texte,valeur) renvoie comme valeurs :
- null, si on a cliqué sur "Annuler"
- la valeur de la zone modifiable, si on a cliqué sur "ok"

On l'écrit:
Exemple de code :
prompt("commentaire","valeur");

On récupère la valeur comme ceci :
Exemple de code :
var m = prompt("commentaire","valeur")

L'exemple ci-dessous montre une autres façon de faire :
Exemple de code :
var m = prompt("entrez votre nom","");
alert(m);

showModalDialog()

Info

La méthode javascript showModalDialog(url, arguments, parametres) est propre à Internet Explorer version>= 4.
Elle permet d'avoir une boite de dialogue plus personnalisée et dans laquelle des traitements peuvent être effectués.

Elle est composée de trois parties :
- l'url de la page html.
- l'argument (information) à faire passer dans la boite de dialogue.
- les paramètres de la boite de dialogue.
La boîte de dialogue renvoie une valeur (window.returnValue = "valeur") une fois fermée.

On l'écrit:
Exemple de code :
var m=showModalDialog("url de la page htmll" , "argument" , "paramètre");

Les paramètre:
- scroll ( yes|no ) affiche les scrollbarres
- center ( yes|no ) affiche la boîte center
- dialogWidth longueur de la boîte
- dialogHeight hauteur de la boîte
- dialogTop position x de la boîte
- dialogLeft position y de la boîte
- dialogHide masque la boîte
- edge ( sunken|raised ) style des arêtes de la boîte
- help ( yes|no ) affiche l'icône d'aide
- resizable ( yes|no ) autorise le redimensionnement
- status ( yes|no ) affiche la barre d'état
- unadorned ( yes|no ) affiche la boîte sans élément de contrôle

On l'écrit comme ceci :
Exemple de code :
var m = showModalDialog("showmodaldialog.html", "", "dialogWidth=100; dialogHeight=100");

L'exemple ci-dessous montre une autres façon de faire.

Exemple

Il semble que l'on ne puisse pas faire passer plusieurs arguments.
Le seul moyen est de créer un Objet.
Exemple de code :
var mo = new Object();
mo.nom ="dmc";
mo.prenom="alias";

var m = showModalDialog("showmodaldialog.html", mo, "status=no; scroll=no; help=no; unadorned=yes");

if(m==true){
  alert("le nom et prénom sont bons.");
}else{
  alert("le nom et prénom ne sont pas bons.");
}

Dans la page showmodaldialog.html pour recupérer l'objet mo:
Exemple de code :
if(window.dialogArguments.prenom == "alias" && window.dialogArguments.nom == "dmc"){
  window.returnValue = true;
  window.close();
}else{
  window.returnValue = false;
  window.close();
}