remplacer le input type=submit par un a href

[Anonymus]

Pour envoyer un formulaire à une seconde page, on utilise habituellement le bouton <input type=submit...

Est il possible d'employer la balise <a href=.. pour cet envoi ?

Merci.

[Jan]

Oui, en appelant un javascript dans ton lien:

document.form.submit()

Sans javascript, je ne pense pas...

[Guest vchahun]

Si tu veux juste afficher le boutton comme un lien, tu pourrais bidouiller un truc du genre:

/* CSS */
input.a {border:0; background:transparent; color:blue}
input.a:hover {text-decoration: underline; cursor: pointer}

 <!--HTML //-->
<input type="submit" value="Envoyer" class="a"/>

Le problème c'est que IE ne comprend pas les :hover pour autre chose que les liens ...

Sinon, on peut aussi varier avec un boutton:

<button type="submit" class="a">Envoyer</a>

Enfin précise pourquoi tu veux utiliser un lien, ça aidera ...

[Anonymus]

J'ai un site à faire, et la présentation du client prévoit un lien entre 2 pages d'un formulaire. Il y a bien le javascript, mais comme je lui ai expliqué, certaines personnes ne l'ont pas. Or pour accéder à la seconde partie du formulaire, et aux autres pages, c'est le passage obligé.

Soit je condamne les personnes qui n'ont pas javascript à ne pas avoir accès à la seconde partie, soit j'enlève le lien, pour mettre un bouton à la place. Mais ca le fera plutot grincer..

De plus, ca fait un moment que je me pose la question, or il y a un certain nombre d'adeptes, sur le Hub, et je me suis demandé si l'un d'eux n'aurait pas la solution..

Voilà

[Jan]

Si le problème pour ton client est seulement le look de sa page, la solution est sans doute de mettre un bouton et de le "css-iser" pour lui donner l'aspect d'un lien.

Autre option (moins élégante), faire le submit sur une image qui a l'aspect d'un lien texte.

[petit-ourson]

Sinon tu mets un lien généré en javascript avec un "document.write" et dans une balise "noscript" tu mets un bouton.

Ainsi, tu as ton liens et cela reste compatible à 100%.

Modifié 7 Octobre 2004 par petit-ourson

[Sylvain Trovalet]

<input type="submit" value="Valider" name="B1"  style="background-color: #FFFFFF; color: #0000EE; font-weight: bold;border: none; font-size:10pt">

[Guest vchahun]

Sinon tu mets un lien généré en javascript avec un "document.write" et dans une balise "noscript" tu mets un bouton.

Ainsi, tu as ton liens et cela reste compatible à 100%.

<{POST_SNAPBACK}>

<script type="text/javascript">
document.write("<a href=\"javascript:document.form.submit()\">Envoyer</a>");
</script>
<noscript><input type="submit" value="envoyer" style="border:0; background:transparent; color:blue; cursor:pointer; text-decoration:underline"/></noscript>

Dans les 2 cas, on aura un truc semblable, seul le code changera.

[LaurentDenis]

Je crains qu'il n'y ait pas de solution vraiment satisfaisante :

- le stylage CSS d'un "input" est hasardeux, chaque navigateur ayant ses limitations spécifique. Ici, par exemple, Mozilla/FireFox ne souligne pas le lien et Opera ne supprime pas la bordure.

- le document.write empêchera le passage éventuel du site en XHTML (documentwrite est ignoré en "vrai" XHTML)

- le bouton posera des problèmes d'accessibilité et de CSS

- d'une manière générale, des utilisateurs seront déroutés de ne pas trouver un bouton submit pour le formulaire, comme ils en ont l'habitude.

En fait, ton client a une très mauvaise idée... Mais ce n'est sans doute pas facile de le lui expliquer

[Anonymus]

Pourtant le Hub possède des boutons, comme ceux pour envoyer les messages, qui pourraient me convenir.

Quels seraient les problèmes pour ce genre de boutons, en css ?

Les boutons 'Ajouter une réponse' du Hub paraissent ils 'customisés' pour tous les navigateurs, ou aurais je des surprises avec certains ?

Mais ce n'est sans doute pas facile de le lui expliquer

C'est peu de le dire...

[Guest vchahun]

Si tu veux des bouttons graphiques, au lieu d'utiliser un lien pour envoyer le formulaire, tu peux faire:

<button type="submit" style="border:0; background:transparent">
<img src="*********">
</button>