Prob de bouton reset et submit

Fermé
scully - 20 déc. 2001 à 10:06
PhP Messages postés 1767 Date d'inscription lundi 11 décembre 2000 Statut Membre Dernière intervention 23 décembre 2009 - 22 déc. 2001 à 23:55
Salut,
je voudrais placer un bouton image dans un formulaire et en plus je mets un onmouseover et onmouseout. Je voudrais que quand je clique sur le bouton 1 cad effacer, il me vide le formulaire comme le fais le bouton RESET. COmment peut-on faire pour appeler la méthode utilisé par le bouton reset et idem pour le bouton submit.
Merci
A+

2 réponses

PhP Messages postés 1767 Date d'inscription lundi 11 décembre 2000 Statut Membre Dernière intervention 23 décembre 2009 607
22 déc. 2001 à 23:55
Salut Scully,


Voici un petit exemple en HTML

Supposons que tu as : la page p1.htm qui contient un formulaire appelé "fbi" (pourquoi pas ?) qui appelle la page p2.htm

Les boutons RESET et SUBMIT sont remplacés respcetivement par les images reset.gif et submit.gif


Ex 1 :

<html>
<head>
<title>PAGE 1</title>
</head>
<body>
<form name="fbi" method="POST" action="p2.htm">
<fieldset><legend>FBI form</legend>
X-File : <input type="text" value="" name="xfile"><br>
<img src="submit.gif" onclick="window.document.fbi.submit()">
<img src="reset.gif" onclick="window.document.fbi.reset()">
</fieldset>
</form>
</body>
</html>

En utilisant de simples images et l'événement onclick on arrive très simplement à simuler les boutons RESET et SUBMIT

La seule différence tient au fait que lorsque le pointeur de la souris survole chaque image il ne change pas de forme pour indiquer un lien.

On peut y remèdier en encapsulant les images dans un lien hypertexte <a>...</a> ou encore en utilisant les boutons images
de cette façon :

Ex 2 :


<html>
<head>
<title>PAGE 1</title>
</head>
<body>
<form name="fbi" method="POST" action="p2.htm">
<fieldset><legend>FBI form</legend>
X-File : <input type="text" value="" name="xfile"><br>
<input type="image" src="reset.gif" onclick="window.document.fbi.reset(); return false;">
<input type="image" src="submit.gif">
</fieldset>
</form>
</body>
</html>

Pour le bouton image submit, on conserve le comportement pas défaut.
Par contre pour le bouton reset, on annule le comportement par défaut lors du clic en retournant false dans l'événement onclick d'où le "return false" ;:)

The Truth is Out There ...

@+
Philippe


Nota : les balises <fieldset> et <legend> sont juste là pour le look ...
1
ted.barton Messages postés 68 Date d'inscription dimanche 17 juin 2001 Statut Membre Dernière intervention 6 mars 2002 3
20 déc. 2001 à 22:47
salut,

pour repondre a ta question, c'est possible
l'objet form de ta page possede deux methodes qui t'interresse: submit et reset
je n'ai jamais testé cette prog mais ça doit marcher comme suit
- tu place un onclick dans tes balises images
-tu appelle une fonction remise_a_zero ou envoyer_formulaire suivant le cas
- supposons que la balise name de ton formulaire soit egale a "monformulaire", les methodes de form associées a ce fomulaire doivent s'appeler comme suit
monformulaire.reset() et monformulaire.submit()

n'oublie pas les parentheses ;-))
et bonne prog
Ted
0