18041 sujets

Questions générales et questions de débutants

[Résolu] Ancre, form et input

Bonjour,

J'essaye de créer un lien qui est sensé placé le curseur directement vers un champ de formulaire.

Suite au contrôle en Javascript, je crée un lien par champ non saisi dans le paragraphe "message".

Après clique sur le lien, le curseur n'est pas dans le champ "ancré". Pourquoi ?

Ci-après mes scripts.

HTML:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
	PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

	<title>Formulaire d'identification</title>

	<link rel="stylesheet" type="text/css" media="screen" href="css/ecran.css" />

	<script type="text/javascript" src="js/script.js"></script>

	<meta name="description" content="formulaire identification" />
</head>
<body>
	<h1>Formulaire</h1>
	<p id="message"></p>
	<form action="" method="post" id="frmIdent" onsubmit="return valider(this);">
		<fieldset>
			<legend>Identification</legend>
			<label id="label_identifiant" for="identifiant">Identifiant <strong>(requis)</strong></label>
			<input id="identifiant" type="text" />
			<label id="label_secret" for="secret">Secret <strong>(requis)</strong></label>
			<input id="secret" type="password" />
			<input type="submit" value="Valider" />
		</fieldset>
	</form>
</body>
</html>


Javascript:
function valider(frm) {

	// Contrôle des données du formulaire
	var nErreurs = 0;
	var anomalies = '';

	var okIdentifiant = false;
	if (frm.elements['identifiant'].value != '') {
		okIdentifiant = true;
	} else {
		nErreurs += 1;
		anomalies += '<br />Merci de <a href="#label_identifiant">renseigner votre identifiant</a>.';
	}

	var okSecret = false;
	if (frm.elements['secret'].value != '') {
		okSecret = true;
	} else {
		nErreurs += 1;
		anomalies += '<br />Merci de <a href="#label_secret">renseigner votre secret</a>.';
	}

	if (okIdentifiant && okSecret) {
		alert('OK !');
		return true;
	} else {
		// Préparation et affichage d'un message explicite
		document.getElementById('message').innerHTML = nErreurs + ' erreur(s) ont &eacute;t&eacute; d&eacute;tect&eacute;e(s) dans les informations soumises:' + anomalies;
		alert('KO !');
		return false;
	}
}


Le CSS est vide.

Merci ! Smiley smile
Modifié par skerain (27 Dec 2012 - 17:41)
Bonjour,

Il va falloir donner le focus au champs de formulaire via javascript malheureusement.
D'accord mais est-ce que tu peux me dire pourquoi ?

D'après ce que j'ai pu lire, la sélection du label devrait placer le curseur dans le champ du formulaire, idem quand je clique sur le label. De plus, j'ai le même problème quand je vise le champ de formulaire via l'ancre plutôt que de viser le label.
Pourquoi c'est une bonne question, à laquelle je n'ai pas de réponse, aucun navigateur n'a le comportement que tu souhaites (je n'ai pas testé IE toute version confondue).

Ca ne m'étonnerais pas que ce soit pour des raisons de sécurité, tu reçois un lien avec une ancre dans l'url, tu focus un champs directement et tu peux faire des choses pas très nettes. J'ai du mal à voir une autre raison de ce comportement.
Sujet clos
Aller à