Discussion :

[pekka77]

Bonjour,

Je développe un composant AJAX composé d'un champ texte et trois champs chachés. La touche "Entrée" est utilisé pour autre chose que la soumission du formulaire, j'utilise donc un script qui permet d'empecher cette soumission. J'aimerai aussi que l'appuie sur cette touche envoie le focus sur le champ suivant à la manière de la touche "tab".
Le problème est ke je ne connais pas l'id du champ suivant (puisque je développe un composant). A priori, il y en a forcément un (le bouton submit) et même s'il y en a pas, j'aimerai que la touche Entrée ait le meme role que la touche Tab.
J'ai pas envie de donner le focus à un champ caché : j'ai essayé et le focus se perd et recommence en début de page.

Je vous donne ci dessous le code actuel pour empecher la touche Entrée :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
document.getElementById("champ-texte").onkeypress=function(e){
	ev= e ? e.which : event.keyCode;
        if(ev==13 || ev==3){
		document.getElementById('num_voie').focus();
		this.form.onsubmit=function(e){
			ev= e ? e.which : event.keyCode;
			if(ev==13 || ev==3){
				return false;
			}
		}
		return false
	}
     }

Merci beaucoup pour votre aide !

[pekka77]

aucune idée ?

[SpaceFrog]

a tout hasard nextSibling avec un nodeCleaner avant ?

[pekka77]

Je peux avoir plus de précision sur le nodecleaner s'il te plait ?
C'est pour épurer le DOM et ne récupérer que ce que l'on souhaite ?

Ce que je voudrais c'est que lorsque lutilisateur appuie sur Entrée sur mon champ, le focus soit donné au prochain champ input, s'il existe. Sinon je bloque juste la touche Entrée comme c'est le cas actuellement.

[SpaceFrog]

un nodeCleaner est un petit script qui nettoie le DOM de sorte que IE et Firefox retournent les mêmes élément, car ils n'on à la base pas la même interprétation des nodes ...

Il doit y avoir un script dasn la faq ou dans les codes sources ...

ainsi en recupérant le nextSibling il ne te reste plus qu'a tester si il s'agit d'un input ...

[pekka77]

Ok je vois ce ke tu veux dire.
Le nodeCleaner sert alors à uniformiser la valeur du nextSibling entre les différents navigateurs.
As tu une idée pour tester le type d'un élément, à savoir s'il s'agit d'un input ou autre chose ?
j'ai cherché sur le net et j'ai pas trouvé gd chose.
Je sais qu'on peut récupérer tous les éléments d'un certain type avec la méthode getElementsByTagName("input") au sein d'un élément. Peut etre que je peux regarder dans ce tableau (je suppose que l'objet retourné est un tableau d'objet input ?) si je trouve mon nextSibling... Mais y a t il une méthode plus simple du genre :

Code :

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

 if (document.getElementById("blabla").nextSibling.type == "input") { blabla }

??

Merci pour les réponses

[SpaceFrog]

nodeName ....

[pekka77]

Merci !
J'ai créé cette petite fonction pour récupérer le prochain élément input par rapport à mon élément :

Code :

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

1
2
3
4
5
			while (elt.nextSibling.nodeName != "INPUT") {
					elt = elt.nextSibling;
					if (elt == NULL) elt = elt.parentNode.nextSibling.firstChild;
					alert(elt.nodeName);
				}

Mais il ne marche pas
Aucun alert, aucune erreur..
Vous voyez qqch qui ne va pas ?

[SpaceFrog]

as tu déja testé le retourn de nextSibling ?

[pekka77]

ou i et il est pas nul. Il me retourne un type text. C'est le texte de l'input.

[SpaceFrog]

ben là tu testes si il est null...
si il est pas null il ne se passe rien c'est normal non ?

[pekka77]

L'alert devrait tout de même générer une boite de dialogue !

[SpaceFrog]

Code :

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

1
2
3
4
while (elt.nextSibling.nodeName != "INPUT") {
					elt = (elt.nextSibling)?elt.nextSibling:elt.parentNode.nextSibling.firstChild;
					alert(elt.nodeName);
				}

[FremyCompany]

Ceci marchera sans doute mieux (mais c'est sans doute encore à améliorer) :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
getNextField=function(h) {
    if (!h) {return h; }
    while (h.nextSibling) {
        h=h.netSibling;
        if (h.tagName && h.tagName.toLowerCase()=="input") {
             return h;
        } else if (h.firstChild) {
             var t=getNextField(h.firstChild); if (t) { return t; }
        }
    }
    return getNextField(h.parentNode);
}

PS: avec ca, pas besoin de node cleaner