Salut,

En réponse à une demande d'un de nos confrères dans un post HTML/CSS je vous fais part de ma dernière trouvaille concernant l'utilisation de showModalDialog qui fonctionne sous IE,NN,FF,OPERA et SAFARI.

J'espère que ça vous sera utile...

Le code source est composé de 4 éléments :

- fichier javascript Include (à télécharger)
- La fonction qui dérive showModalDialog en fonction du navigateur
- fonction appelante
- dérivation de la fonction qui permet de renvoyer la valeur à la fenêtre appelante à l'aide de window.returnValue depuis la fenêtre appelée.

Etape 1 : Fichier include côté navigateur

Télécharger le fichier include suivant : http://www.ezlogic.mc/_Includes/scripts/dialog.js

Placez le dans le répertoire dans lequel vous rangez vos scripts puis, faites une référence à ce fichier en utilisant la balise (je précise que c'est un code source que j'ai récupéré sur le net mais que j'ai du modifier pour qu'il fasse exactement ce que je souhaitais):

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
 
<script language=javascript src="/_Includes/scripts/dialog.js"></script>
C'est grace à la fonction dialog que je gère le focus de la fenêtre ouverte.

Etape 2 : Dérivation de la fonction showModalDialog

Cette technique permet de toujours utiliser la fonction showModalDialog sur tous les navigateurs (et c'est bien pratique).

Comme vous pourrez le constater, j'analyse les paramètres passés à la fonction showModalDialog et je les convertis pour qu'ils correspondent aux paramètres de la fonction open.

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
 
if (!window.showModalDialog) {
  window.showModalDialog=function(a,b,c) {
    //préparation des arguments
    var targ = new Array();
    var sArgs = new String();
    var rExp = new RegExp();
    rExp = /px/g;
    var S = new String(c);
    if (S) {
      targ = S.split(";")
      maxi = targ.length
      for (i=0;i<maxi;i++) {
        S = new String(targ[i])
        tThisArg = S.split(":")
        S = new String(tThisArg[0])
        switch (S.toLowerCase()) {
        case "dialogheight":
          S = new String(tThisArg[1])
          sArgs += ",height=" + S.replace(rExp,"")
          break;
        case "dialogleft":
          S = new String(tThisArg[1])
          sArgs += ",left=" + S.replace(rExp,"")
          break;
        case "dialogtop":
          S = new String(tThisArg[1])
          sArgs += ",top=" + S.replace(rExp,"")
          break;
        case "dialogwidth":
          S = new String(tThisArg[1])
          sArgs += ",width=" + S.replace(rExp,"")
          break;
        case "resizable":
          S = new String(tThisArg[1])
          switch(S) {
            case "1":
            case "yes":
            case "on":
            sArgs += ",resizable=1"
            break;
          default :
            sArgs += ",resizable=0"
          }
          break;
        case "scroll":
          /*
            sArgs += ",scrollbars=1"
         */
          S = new String(tThisArg[1])          
          switch(S) {
          case "1":
          case "yes":
          case "on":
            sArgs += ",scrollbars=1"
            break;
          default :
            sArgs += ",scrollbars=0"
          }          
          break;
        case "status":
          S = new String(tThisArg[1])
          switch(S) {
            case "1":
            case "yes":
              sArgs += ",status=1"
              break;          
            default :
              sArgs += ",status=0"
            }
            break;
          default:
            //"unadorned"	
            //"dialoghide"
            //"center"
            //"edge"
            //"help"
          }
        }
        if (sArgs) {
          sArgs = sArgs.substr(1)
          sArgs += ",menubar=0,titlebar=1,toolbar=0,location=0"
        }
        Dialog(a,null,null,sArgs);
      }
    }	
}
Etape 3 : La fonction appelante

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
 
    /* URL de la fenêtre appelée (notez que les paramètres sont passés en GET*/
    var szURL="../dlgQte.asp?Mode=<%=Mode%>&CodeLangue=<%=CodeLangue%>&Valeur=" + ValeurInitRecupCoteClient
  RV = window.showModalDialog(szURL,null,"scroll:no;center:yes;help:no;dialogWidth:200px;dialogHeight:160px;resizable:no");
  if (RV){
    //Uniquement pour IE, pour les autres navigateurs ça se passe dans la fenêtre appelee
    window.document.frm.hidQte.value = RV
    window.document.frm.submit();
  }
Etape 4 : La valeur de retour
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
function cmdOk_onclick() {
var qte = window.document.getElementById("txtQte")
  var sMontant = new String(qte.value)
  if ((sMontant.indexOf(".")!=-1)||(sMontant.indexOf(",")!=-1)) {
    alert("<%=txtMSG1%>")
    return false
  }
  var Montant = parseFloat(qte.value)
  if (isNaN(Montant)){
    alert("<%=txtMSG2%>");	
    return false;
  }
  RV=qte.value;
  if (window.opener) {
    /*
      Cas non IE, présence de window.opener puisque l'on est dans un window.open
      Je passe la valeur au champ du formulaire de la fenêtre appelante et je fais directement le submit avant de fermer la fenêtre appelée
    */
    window.opener.document.frm.hidQte.value = RV;
    window.opener.document.frm.submit();
  } else {
    window.returnValue = RV; 
  }	
  window.close();
}
Voilà... avec ça vous devriez y arriver.

J'apprécierais que l'on poste toutes les améliorations que vous pourriez y apporter sur ce thread.

@+

Laurent Jordi