Numéro d’identification de véhicule

Conseils

Lorsque nous demandons aux utilisateurs leur numéro d’identification de véhicule (NIV), nous voulons leur dire d’emblée où le trouver. Pour les utilisateurs qui ont besoin de plus d’aide, nous fournissons davantage d’informations dans une fenêtre modale d’étiquetage des champs.

Numéro d’identification de véhicule

<!-- Field with tooltip label -->
<label for="vehicle-identification-number"><a tabindex="0" data-target="modal-address" aria-haspopup="dialog"
	aria-controls="modal-address" class="modal-button info">Numéro d’identification de véhicule</a></label>
<div class="gnb-form-helper-text">
Votre numéro d'identification est composé de 17 chiffres et se trouve sur la carte grise de votre véhicule.
</div>
<input type="text" name="vehicle-identification-number" id="vehicle-identification-number" />

<!-- Dialogue modal d'information sur les champs - placez-le à l'extérieur de tout élément <form> de votre page -->
<div class="gnb-modal" id="modal-address" role="dialog" aria-modal="true"
aria-labelledby="modal-title-address" aria-describedby="modal-description-address">
<dialog>
	<button class="gnb-btn-close close-modal-button" data-target="modal-address"><span
			class="sr-only">Fermez la fenêtre modale</span><i class="fa-solid fa-xmark"></i></button>
	<div class="gnb-modal-header">
		<h2 id="modal-title-address">Numéro d’identification de véhicule</h2>
	</div>
	<div class="gnb-modal-body" id="modal-description-address">
		<p>
		Votre numéro d'identification est composé de 17 chiffres et se trouve sur la carte grise de votre véhicule.
		</p>
	</div>
</dialog>
</div>

<!-- Ajoutez ceci au bas de votre page avant la balise de fermeture body -->
<script src="gnb-modals-1.0.0.js"></script>

Partiel numéro d’identification de véhicule

<label for="vehicle-identification-number">
	<a tabindex="0" data-target="modal-vin-partial" aria-haspopup="dialog" aria-controls="modal-vin-partial" class="modal-button info">
	Les 6 premiers chiffres du numéro d’identification de véhicule (NIV) 
	</a>
</label>
<div class="gnb-form-helper-text">
Votre NIV se trouve sur la carte grise de votre véhicule.
</div>
<input type="text" name="vehicle-identification-number" id="vehicle-identification-number"
	class="gnb-field-sm" maxlength="6" />

<!-- Dialogue modal d'information sur les champs - placez-le à l'extérieur de tout élément <form> de votre page -->
<div class="gnb-modal" id="modal-vin-partial" role="dialog" aria-modal="true"
	aria-labelledby="modal-title-vin-partial" aria-describedby="modal-description-vin-partial">
	<dialog>
		<button class="gnb-btn-close close-modal-button" data-target="modal-vin-partial"><span
				class="sr-only">Fermez la fenêtre modale</span><i class="fa-solid fa-xmark"></i></button>
		<div class="gnb-modal-header">
			<h2 id="modal-title-vin-partial">Numéro d’identification de véhicule</h2>
		</div>
		<div class="gnb-modal-body" id="modal-description-vin-partial">
			<p>
			Le numéro d’identification de véhicule comporte 17 chiffres et figure sur la carte grise du véhicule.
			</p>
		</div>
	</dialog>
</div>

<!-- Ajoutez ceci au bas de votre page avant la balise de fermeture body -->
<script src="gnb-modals-1.0.0.js"></script>