Simulation d'un clic sur un bouton image

**andrebernard** · 17/02/2009, 10h13

Boujour à tous

Voila je suis arrivé a simuler un clic sur certains boutons traditionnels de pages, mais je n'arrive pas a le faire sur un bouton image.
J'aimerais savoir comme s'y prendre pour cette ligne par exemple

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
 <input type="image" src="/images/bt_valider_bleu1024.gif" value="login" />

J'ai essayé :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
document.myform.login.click()
document.post.login.click()
document.all.image.click()

Et rien ne marche
Alors j'ai essayé

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.myform.submit()

Et la ça marche, ça envoi la page.
Mais je voudrais connaitre la methode pour cliquer sur ce bouton image, car la prochaine page, va avoir beaucoup de boutons images et il faudra bien que je puisse simuler mon click en adressant le bon bouton

Voici le code tout simple de la page
C'est une HTTPS, je ne sais pas si cela a une importance ???

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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
  <html> 
    <head> 
      <title> 
       </title> 
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
      <link rel="shortcut icon" href="/images/icone.ico"> 
  <script language="javascript"> 
    if (document.layers) { 
      document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"/styles/style.css\">"); 
    } else { 
      document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"/styles/style.css\">"); 
    } 
  </script> 
      <script language='javascript'> 
        history.forward(); 
      </script> 
    </head> 
    <body class="login" > 
      <form action="/login" method="post" name="myform"> 
        <table width="450"> 
          <tr> 
            <td class="ariane"> 
              <div class="arianeModule"> 
                Authentification 
              </div> 
            </td> 
          </tr> 
          <tr> 
            <td> 
              <table width="100%"> 
                <tr> 
                  <td width="10" height="10"><img src="/images/bloc_a_hg.gif" width="10" height="10"></td> 
                  <td height="10" bgcolor="#B9C1ED"><img src="/images/pix.gif" width="1" height="1"></td> 
                  <td width="10" height="10"><img src="/images/bloc_a_hd.gif" width="10" height="10"></td> 
                </tr> 
              </table> 
            </td> 
          </tr> 
          <tr class="bandeau"> 
            <td class="erreur"> 
 
              &nbsp; 
            </td> 
          </tr> 
          <tr> 
            <td> 
              <table width="100%" class="bandeau"> 
                <tr> 
 
                  <td class="premiere"> 
                    Identifiant : 
                  </td> 
                  <td> 
 
                         <input name="login" type="text" class="input" size="30" /> 
 
 
                  </td> 
                </tr> 
                <tr> 
                  <td class="premiere"> 
                    Mot de passe : 
                  </td> 
                  <td> 
                    <input name="password" type="password" class="input" size="30" /> 
                  </td> 
                </tr> 
                <tr> 
                  <td class="premiere"> 
                    Portail : 
                  </td> 
                  <td> 
                    <select name="portail" class="input" /> 
                      <option value="ENC"> 
                      Programmation et Pilotage des Interventions 
                      </option> 
                      <option value="PIL"> 
                      Administration et Suivi d'Activité 
                      </option> 
                    </select> 
                  </td> 
                </tr> 
              </table> 
            </td> 
          </tr> 
          <tr class="bandeau"> 
            <td class="actions"> 
              <input type="image" src="/images/bt_valider_bleu1024.gif" value="login" /> 
            </td> 
          </tr> 
          <tr> 
            <td> 
              <table width="100%"> 
                <tr> 
                  <td width="10" height="10"><img src="/images/bloc_a_bg.gif" width="10" height="10"></td> 
                  <td height="10" bgcolor="#B9C1ED"><img src="/images/pix.gif" width="1" height="1"></td> 
                  <td width="10" height="10"><img src="/images/bloc_a_bd.gif" width="10" height="10"></td> 
                </tr> 
              </table> 
            </td> 
          </tr> 
          <tr> 
            <td class="erreur"> 
 
            </td> 
          </tr> 
        </table> 
      </form> 
      <script language="JavaScript">document.myform.login.focus();</script>        
    </body> 
  </html>

Je vous remercie beaucoup de votre aide
Bonne journée

**SpaceFrog** · 17/02/2009, 10h26

un bouton image se comporte comme un bouton submit au nioveau de la soumission du formulaire et tu ne pourras pas faire autremetn que de mettre une valeur dynamiquement dans un input hidden qui te permettra de savoir quel bouton image tu as emulé ...

**andrebernard** · 17/02/2009, 10h37

Merci beaucoup SPACEFROG de ta reponse rapide

Mais vu que c'est la premiere fois que je danse le "JAVA"

La combine du hidden m'a beaucoup aidé, parce que ça ne me parle pas plus que ça

Tu aurait pas un lien ou un exemple pour que je comprenne mieux

Encore merci

**SpaceFrog** · 17/02/2009, 11h46

JAVA n'a rien à voir avec javascript ...

un element de type hidden dans le form n'est pas visible mais est transmis avec les autres données du formulaire ...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<input type="hidden" name="origine" value="données cachées"  id="orignie" />

il te suffit de renseigner dynamiquement cet element:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById('origine').value="image1"

ainsi coté sreveur tu recupères :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$_POST['origine']

**andrebernard** · 17/02/2009, 12h41

Merci de tes precision, mais j'ai du merder quelque part

Car j'ai rajouté la ligne <input type="hidden" name="origine" value="données cachées" id="orignie" /> que tu m'as donné apres le bouton image et la ligne document.getElementById('origine').value="image1" entre les balise <Script></Script> et ça ne marche pas

Voici la page modifiée

Code html :

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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!-- saved from url=(0039)https://distri-pictrel.edf.fr/index.jsp -->
<HTML><HEAD><TITLE></TITLE>
<META http-equiv=Content-Type content="text/html; charset=iso-8859-1"><LINK 
href="/images/icone.ico" rel="shortcut icon">
<SCRIPT language=javascript>
    if (document.layers) {
      document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"/styles/style.css\">");
    } else {
      document.write("<link rel=\"stylesheet\" type=\"text/css\" href=\"/styles/style.css\">");
    }
  </SCRIPT>
 
<SCRIPT language=javascript>
        history.forward();
      </SCRIPT>
 
<META content="MSHTML 6.00.2800.1459" name=GENERATOR></HEAD>
<BODY class=login>
<FORM name=myform action=/login method=post>
<TABLE width=450>
  <TBODY>
  <TR>
    <TD class=ariane>
      <DIV class=arianeModule>Authentification</DIV></TD></TR>
  <TR>
    <TD>
      <TABLE width="100%">
        <TBODY>
        <TR>
          <TD width=10 height=10><IMG height=10 
            src="Authentification V4_3_fichiers/bloc_a_hg.gif" 
          width=10></TD>
          <TD bgColor=#b9c1ed height=10><IMG height=1 
            src="Authentification PICTREL V4_2_fichiers/pix.gif" width=1></TD>
          <TD width=10 height=10><IMG height=10 
            src="Authentification V4_3_fichiers/bloc_a_hd.gif" 
          width=10></TD></TR></TBODY></TABLE></TD></TR>
  <TR class=bandeau>
    <TD class=erreur>&nbsp; </TD></TR>
  <TR>
    <TD>
      <TABLE class=bandeau width="100%">
        <TBODY>
        <TR>
          <TD class=premiere>Identifiant : </TD>
          <TD><INPUT class=input size=30 name=login> </TD></TR>
        <TR>
          <TD class=premiere>Mot de passe : </TD>
          <TD><INPUT class=input type=password size=30 name=password> </TD></TR>
        <TR>
          <TD class=premiere>Portail : </TD>
          <TD><SELECT class=input name=portail> <OPTION value=ENC 
              selected>Programmation et vue des fiches</OPTION> 
              <OPTION value=PIL>Administration et Suivi 
            d'Activité</OPTION></SELECT> </TD></TR></TBODY></TABLE></TD></TR>
  <TR class=bandeau>
    <TD class=actions><INPUT type=image 
      src="Authentification V4_3_fichiers/bt_valider_bleu1024.gif" 
      value=login><input type="hidden" name="origine" value="données cachées" id="origine" /> 
</TD></TR>
  <TR>
    <TD>
      <TABLE width="100%">
        <TBODY>
        <TR>
          <TD width=10 height=10><IMG height=10 
            src="Authentification V4_2_fichiers/bloc_a_bg.gif" 
          width=10></TD>
          <TD bgColor=#b9c1ed height=10><IMG height=1 
            src="Authentification V4_3_fichiers/pix.gif" width=1></TD>
          <TD width=10 height=10><IMG height=10 
            src="Authentification V4_3_fichiers/bloc_a_bd.gif" 
          width=10></TD></TR></TBODY></TABLE></TD></TR>
  <TR>
    <TD class=erreur></TD></TR></TBODY></TABLE></FORM>
<SCRIPT language=JavaScript>document.myform.login.focus();document.getElementById('origine').value="login";</SCRIPT>
</BODY></HTML>