Coordonnées 
				
					Titre  (obligatoire)  
					
						 
						D. Ph. 
						Me 
						M. 
						Madame 
					 
				
				
					Voir le code 
					
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="title1" class="required"><span class="field-name">Titre</span> <strong class="required">(obligatoire)</strong></label>
			<select class="form-control" id="title1" name="title1" autocomplete="honorific-prefix" required="required">
				<option label="Sélectionner un titre"></option>
				<option value="dr">D. Ph.</option>
				<option value="esq">Me</option>
				<option value="mr">M.</option>
				<option value="ms">Madame</option>
			</select>
		</div> 
				 
				
					Prénom  (obligatoire)  
					 
				
				
					Voir le code 
					
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="fname1" class="required"><span class="field-name">Prénom</span> <strong class="required">(obligatoire)</strong></label>
			<input class="form-control" id="fname1" name="fname1" type="text" autocomplete="given-name" required="required" data-rule-minlength="2" />
		</div> 
				 
				
					Nom de famille  (obligatoire)  
					 
				
				
					Voir le code 
					
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="lname1" class="required"><span class="field-name">Nom de famille</span> <strong class="required">(obligatoire)</strong></label>
			<input class="form-control" id="lname1" name="lname1" type="text" autocomplete="family-name" required="required" data-rule-minlength="2" />
		</div> 
				 
				
					Numéro de téléphone (avec l'indicatif régional)  (obligatoire)  
					 
				
				
					Voir le code 
					
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="tel1" class="required"><span class="field-name">Numéro de téléphone (avec l'indicatif régional)</span> <strong class="required">(obligatoire)</strong></label>
			<input class="form-control" id="tel1" name="tel1" type="tel" autocomplete="tel" required="required" data-rule-phoneUS="true" />
		</div> 
				 
				
					Code postal (Canada)  (obligatoire)  
					 
				
				
					Voir le code 
					
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="pcodeca1" class="required"><span class="field-name">Code postal</span> <strong class="required">(obligatoire)</strong></label>
			<input class="form-control" id="pcodeca1" name="pcodeca1" type="text" autocomplete="postal-code" required="required" data-rule-postalCodeCA="true" />
		</div> 
				 
				
					Adresse électronique  (votrenom@domaine.com) 
					 
				
				
					Voir le code 
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="email1"><span class="field-name">Adresse électronique</span> (votrenom@domaine.com)</label>
			<input class="form-control" id="email1" name="email1" type="email" autocomplete="email" />
		</div> 
				 
				
					URL du site Web (https://www.url.com)  
					 
				
				
					Voir le code 
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="url1"><span class="field-name">URL du site Web (https://www.url.com)</span></label>
			<input class="form-control" id="url1" name="url1" type="url" autocomplete="url" />
		</div> 
				 
				
					Fichier  (obligatoire)  
					 
				
				
					Voir le code 
					
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="file1" class="required"><span class="field-name">Fichier</span> <strong class="required">(obligatoire)</strong></label>
			<input id="file1" name="file1" type="file" required="required" />
		</div> 
				 
			 
			
				Autres exemples 
				
				
					Voir le code 
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="date1"><span class="field-name">Date</span><span class="datepicker-format"> (<abbr title="Les quatre chiffres de l'année, tiret, les deux chiffres du mois, tiret, les deux chiffres du jour">AAAA-MM-JJ</abbr>)</span></label>
			<input class="form-control" id="date1" name="date1" type="date" data-rule-dateISO="true" />
		</div> 
				 
				
					Heure  (hh:mm) 
					 
				
				
					Voir le code 
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="time1"><span class="field-name">Heure</span> (hh:mm)</label>
			<input class="form-control" id="time1" name="time1" type="time" />
		</div> 
				 
				
					Nombre  (entre -1 et 1, par pas de 0,1) 
					 
				
				
					Voir le code 
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
	...
	<div class="form-group">
		<label for="number1"><span class="field-name">Nombre</span> (entre -1 et 1, par pas de 0,1)</label>
		<input class="form-control" id="number1" name="number1" type="number" min="-1" max="1" step="0.1"/>
	</div> 
				 
				
					Alphanumérique  (4 caractères minimum) 
					 
				
				
					Voir le code 
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="an1"><span class="field-name">Alphanumérique</span> (4 caractères minimum)</label>
			<input class="form-control" id="an1" name="an1" type="text" data-rule-alphanumeric="true" data-rule-minlength="4" />
		</div> 
				 
				
					Numérique  (chiffres seulement) 
					 
				
				
					Voir le code 
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="numeric1"><span class="field-name">Numérique</span> (chiffres seulement)</label>
			<input class="form-control" id="numeric1" name="numeric1" type="number" data-rule-digits="true" />
		</div> 
				 
				
					Lettres seulement  (5 caractères maximum) 
					 
				
				
					Voir le code 
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="letters1"><span class="field-name">Lettres seulement</span> (5 caractères maximum)</label>
			<input class="form-control" id="letters1" name="letters1" type="text" size="5" maxlength="5" data-rule-lettersonly="true" />
		</div> 
				 
				
					Lettres et des signes de ponctuation seulement  (ponctuation qui est permise : [. , ( ) "]) 
					 
				
				
					Voir le code 
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="text1"><span class="field-name">Lettres et des signes de ponctuation seulement</span> (ponctuation qui est permise : [. , ( ) "])</label>
			<input class="form-control" id="text1" name="text1" type="text" data-rule-letterswithbasicpunc="true" />
		</div> 
				 
				
					Maximum de 10 mots  
					 
				
				
					Voir le code 
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="word1"><span class="field-name">Maximum de 10 mots</span></label>
			<input class="form-control" id="word1" name="word1" type="text" data-rule-maxWords="10" />
		</div> 
				 
				
					Minimum de 2 mots  
					 
				
				
					Voir le code 
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="word2"><span class="field-name">Minimum de 2 mots</span></label>
			<input class="form-control" id="word2" name="word2" type="text" data-rule-minWords="2" />
		</div> 
				 
				
					Entre 2 et 10 mots  
					 
				
				
					Voir le code 
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="word3"><span class="field-name">Entre 2 et 10 mots</span></label>
			<input class="form-control" id="word3" name="word3" type="text" data-rule-rangeWords="[2,10]" />
		</div> 
				 
				
					Sans d'espaces blancs  
					 
				
				
					Voir le code 
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="nowhitespace1"><span class="field-name">Sans d'espaces blancs</span></label>
			<input class="form-control" id="nowhitespace1" name="nowhitespace1" type="text" data-rule-nowhitespace="true" />
		</div> 
				 
				
					Mot de passe  (entre 5 et 10 caractères) 
					 
					Confirmez votre mot de passe  
					 
				
				
					Voir le code 
					<div class="wb-frmvld">
	<form action="#" method="get" id="validation-example">
		...
		<div class="form-group">
			<label for="password1"><span class="field-name">Mot de passe</span> (entre 5 et 10 caractères)</label>
			<input class="form-control" id="password1" name="password1" type="password" autocomplete="new-password" maxlength="10" size="10" data-rule-rangelength="[5,10]" />
			<label for="passwordconfirm"><span class="field-name">Confirmez votre mot de passe</span></label>
			<input class="form-control" id="passwordconfirm" name="passwordconfirm" type="password" autocomplete="new-password" maxlength="10" size="10" data-rule-equalTo="#password1" />
		</div>