Simulation d'un clic sur un bouton image

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

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, 09h26

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, 09h37

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, 10h46

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, 11h41

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>

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

ben si tu ne soumets pas le form ...

**Bovino** · 17/02/2009, 11h51

Relis ce que tu as mis en gras et tu devrais résoudre par toi-même les fautes de frappe !

**SpaceFrog** · 17/02/2009, 12h03

faut pas copier coller mes c...ies

o r i g i n e

**andrebernard** · 17/02/2009, 14h02

Bah oui c'est bien origine que j'ai ecris
J'comprend plus rien

Tu avais inversé et ecris "orignie" j'ai corrigé, j'aurais pas du ???

Vous savez j'ai jamais fait de javascript, pour moi c'est du chinois, c'est pour ça que je m'adresse a des caids comme vous.
Je comprend vite, mais faut m'expliquer longtemps

Si vous pouviez me parler comme a un bébé, ce serait gentil

Car en fait comme je n'ai jamais ecris une ligne de javascript ce sera déja bien assez compliqué pour moi comme mots

**Bovino** · 17/02/2009, 14h20

Si vous pouviez me parler comme a un bébé

Ca va pas être trop dur vu que ton code a dû être écrit à l'époque où j'en étais un !

Par exemple :

Code :

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

1
2
3
4
5
6
7
<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>

très amusant !

**Bovino** · 17/02/2009, 14h28

Plus sérieusement, tu ne peux pas passer par des input de type image, donc utilise des images classiques, puis au clic, tu modifies le champ hidden et tu soumets le formulaire :

Code :

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

<img src="..." alt="valeur à transmettre" onclick="document.getElementById('origine').value=this.alt;document.forms['myname'].submit();" />

Simulation d'un clic sur un bouton image

JavaScript

Discussions similaires

Partager

Partager