attribut pattern et required avec javacript

**LeGilou** · 15/03/2012, 10h51

Bonjour à tous,

J'essaye d'utiliser les nouveaux attributs de HTML5 comme pattern et required.
Il semble qu'il ne fonctionne que lorsqu'on utilise le bouton "submit" du formulaire, mais pas lorsque le formulaire est validé par une fonction javascript.
Ce code devrait aider à comprendre mon problème :

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
 
<html>
	<head>
		<title></title>
		<script type="text/javascript">
			function click_validForm() {
				/* traitements quelconques ...*/
				document.getElementById("aForm").submit()	
			}
 
		</script>
	</head>
 
	<body>
		<form id='aForm' action="">
			<label for="pays">Code alpha-3 (ex : FRA)</label> : 
			<input type='text' name="pays" required pattern="[A-Za-z]{3}" /><br />
			<a href="javascript:click_validForm()">valider via la fonction javascript</a> ou 
			<input type="submit" value="valider via le bouton submit" />
		</form>
	</body>
</html>

Avez vous une idée pour que ces attributs fonctionnent avec la fonction form.submit() d'une fonction javascript ?

Je vous remercie,
Bonne journée,

Gilou.

**SpaceFrog** · 15/03/2012, 11h25

pour le required, voici ce que dit le w3c
http://dev.w3.org/html5/spec/Overvie...-being-missing

**Bovino** · 15/03/2012, 11h33

De toute façon, faire un submit() en JavaScript n'est pas la meilleure façon de procéder puisque cela ne déclenche pas l'événement submit du formulaire et donc par rebond les actions qui y sont liées (ce qui doit expliquer en partie le dysfonctionnement).

Le mieux est d'associer ta fonction click_validForm() à l'événement submit du formulaire et de lui faire renvoyer true ou false selon que tu veux valider ou non l'envoi :

Code html :

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

<form id='aForm' action="" onsubmit="return click_validForm()">

Code :

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

1
2
3
4
function click_validForm() {
	/* traitements quelconques ...*/
	return true;    // ou false
}

**LeGilou** · 15/03/2012, 11h49

Je te remercie pour cette réponse.
Ça veut donc dire qu'on ne peux pas valider un formulaire correctement avec un lien de type :

Code :

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

1
2
 
<a href="javascript:click_validForm()">valider</a>

Il faut forcement utiliser le bouton submit ?

**Bovino** · 15/03/2012, 11h54

Si, dans l'absolu c'est possible, mais il faut savoir que faire un submit() par programmation entraine des contraintes supplémentaires liées au fait qu'il ne déclenche pas l'événement submit. En particulier si tu as des vérifications à faire sur ton formulaire.

Donc utiliser le bouton submit (ou un input image) est largement préférable, tout en sachant que tu peux très bien donner des styles aux input

**SpaceFrog** · 15/03/2012, 11h59

déclenche pas l'événement submit

???

onsubmit tu veux dire Beef non ??

attribut pattern et required avec javacript

JavaScript

Discussions similaires

Partager

Partager