Aller au contenu
  • Pas encore inscrit ?

    Pourquoi ne pas vous inscrire ? C'est simple, rapide et gratuit.
    Pour en savoir plus, lisez Les avantages de l'inscription... et la Charte de Zébulon.
    De plus, les messages que vous postez en tant qu'invité restent invisibles tant qu'un modérateur ne les a pas validés. Inscrivez-vous, ce sera un gain de temps pour tout le monde, vous, les helpeurs et les modérateurs ! :wink:

peKKa

[JavaScript] Comment ça fonctionne les index d'un select ??

Messages recommandés

Bonjour,

 

En gros ma question se résumé au titre du post.

 

J'ai un select avec beaucoup d'options. La liste déroulante a un ascenseur très petit ce qui ne facilite pas du tout la sélection d'un élément.

J'ai donc pensé à filtrer un peu ce select en choisissant à l'aide d'un autre select la première lettre.

En choisissant par exemple B sur ce nouveau select je veux que le premier select s'actualise en laissant seulement les options commençant par un B. Ce serait l'idéal pour réduire le nombre d'éléments dans le select.

 

Bref pour cela j'ai fait une petite fonction javascript (je maitrise pas trop cet outil encore) mais je m'emmêle avec les index du select !!

 

Bon je vous montre le code!

Je vous rappelle que j'ai deux select :

- un avec bcp bcp d'options et meme un peu trop (form : noms, select : nom)

- un avec les lettres de l'alphabet pour justement reduire le nombre d'options de l'autres select (form : tri, select : alphab)

voilà la fonction :

 

<script language="javascript">
 function maj() 
 {
var i;
var j=0;
var nb = document.forms.noms.nom.options.length;
for(i=0;26>i;i++)
{
  if (document.forms.tri.alphab.options[i].selected)
  {
	var lettre1 = document.forms.tri.alphab.options[i].text;
	for(j=0;nb>j;j++)
	{
	  var nom = document.forms.noms.nom.options[j].text;
	  var lettre2 = nom.slice(0,1);

	  if (lettre2 != lettre1)
	  {
		document.forms.noms.nom.options[j]=null; 
	  }
	}
  }
}
 }
</script>

 

En fait le pb c'est qu'il ne parcourt pas tous les éléments du tableau.

S'il y a 14 éléments l'index ne va pas de 0 à 13... il va jusqu'à 7 et après il y a des valeurs indéfinies apparemment... bref je comprends pas trop ce qu'il se passe!

 

Sinon autre question : une fois que j'aurai fait cela mon option sera bien épurgé en choisissant une lettre mais si je veux choisir une nouvelle lettre comment récupérer toutes les anciennes valeurs. Apparemment c'est pas possible parce que je les aurais supprimées..

 

Voilà!

 

Merci pour votre aide !

Partager ce message


Lien à poster
Partager sur d’autres sites

comment récupérer toutes les anciennes valeurs. Apparemment c'est pas possible parce que je les aurais supprimées..
Je crois que, rien que pour cela, il va falloir procéder autrement dans ton remplissage / suppression d'éléments de liste...

D'ailleurs, à propos de suppression, le fait de mettre à null un élément de tableau ne le "supprime" pas il est donc normal que tu te retrouves avec des "trous" lorsque tu parcours ton tableau par la suite ;-)

 

Si tu as de la chance, ma connexion Internet va pouvoir tenir le coup et tu pourras jeter un oeil aux sources de cette page qui manipule des listes.

http://kewlcat.no-ip.org/tests/suggest.html

 

Ce qu'il faut, c'est récupérer le contenu intégral de la liste une fois la page chargée et recalculer un nouveau tableau d'Options à chaque fois que tu modifies ton choix dans la seconde liste.

Partager ce message


Lien à poster
Partager sur d’autres sites

Merci pour ton aide je vais regarder tes sources!

Sinon pour les indices j'ai compris le truc. En fait ce n'est pas des trous qui apparaissaient. En mettant une valeur à null, les index des valeurs suivantes ont été décrémentés.

Donc dans mon script il suffit juste de décrémenter l'indice de boucle quand une option est supprimée.

Donc ça marche mais bien sur je n'ai pas trouvé de moyen pour retrouver la liste !

je vais donc me pencher sur ce que tu as fait. A vue d'oeil, je pense que ça va bien me rendre service et donc je te remercie.

Partager ce message


Lien à poster
Partager sur d’autres sites

Ok j'ai compris le principe de ton code.

Toi tu as stocké les valeurs initiales dans un autre select et tu les recharges à chaque initialisation.

Moi je n'ai pas envie d'afficher un select supplémentaire sur ma page. Alors deux questions me viennent :

- Existe t il un attribut du select pour qu'il soit caché ?

- Sinon où puis-je stocker les donneées initiales pour les recharger à chaque changement de lettre ? dans un tableau ? une table de hash serait mieux je pense pour stocker en tant que clé la valeur de chaque option mais je ne sais pas si ça existe en JavaScript....

 

Merci

Partager ce message


Lien à poster
Partager sur d’autres sites

Sur la page j'ai deux select parce que j'avais deux solutions différentes à mon problème (à celui de quelqu'un d'autre, en fait), mais c'est parfaitement faisable avec un seul...

 

Euh, plus simplement, tu peux arriver sur ta page avec ton (seul) select contenant toute la liste et la garder "au chaud" (il suffit de déclarer une variable "globale" et de lui affecter le tableau d'Options du select) dans l'évenement onLoad, ensuite à chaque changement tu crées un nouvel Array d'Options que tu affectes à ton select et tout fonctionnera normalement.

 

Je ne vois pas trop pourquoi tu aurais besoin d'une table de hashage puisque tu n'as pas de couples de valeurs, et de toute façon il n'existe pas d'objet Hashtable en JavaScript (bien qu'il soit possible de déclarer un tableau avec des index sous forme de chaîne et non d'entiers, mais c'est une autre histoire....)

Partager ce message


Lien à poster
Partager sur d’autres sites

Je ne vois pas trop pourquoi tu aurais besoin d'une table de hashage puisque tu n'as pas de couples de valeurs,

 

Si justement !

Un peu de code pour voir plus clair :

<select>
<option value="valeur1">valeur2</option>
</select>

 

Tu vois j'ai le couple (valeur1, valeur2) pour chaque option.

Je vais créer un tableau à deux dimensions je pense !

ça doit etre tout à fait faisable :P

Je m'oqp de ça demain si j'ai un pb je repasserai :P

 

A+ et merci

Partager ce message


Lien à poster
Partager sur d’autres sites

Okay... Je voyais pas les choses comme ça ;-)

A priori tu dois pouvoir te constituer un tableau en créeant les éléments de ton tableau en passant par une boucle sur chaque Option : tableau[tonOption.value] = tonOption

En espérant que ça fonctionne (je n'ai jamais tenté d'utiliser un Array comme une Hashtable)

Partager ce message


Lien à poster
Partager sur d’autres sites

Voilà tout marche nickel !!!

Merci pour ton aide !!

Sinon, comme tout ce que j'ai fait ne marchera que si l'utilisateur a activé le JavaScript, je voudrais afficher un message dans le cas où il ne l'a pas activé.

Existe-t-il un moyen de détecter si l'utilisateur a activé le JavaScript ?

 

Merci :P

Partager ce message


Lien à poster
Partager sur d’autres sites

Utilise la balise <noscript> ...

 

Autre solution : mettre un <div> avec un message en Arial 24 gras rouge qui demande à activer le JavaScript, que tu planques lors du onLoad ;-) (donc si le JavaScript n'est pas exécuté, le <div> restera affiché)

Partager ce message


Lien à poster
Partager sur d’autres sites

Autre solution : mettre un <div> avec un message en Arial 24 gras rouge qui demande à activer le JavaScript, que tu planques lors du onLoad :P (donc si le JavaScript n'est pas exécuté, le <div> restera affiché)

 

Bonne idée ! :P:-P

Partager ce message


Lien à poster
Partager sur d’autres sites

Créer un compte ou se connecter pour commenter

Vous devez être membre afin de pouvoir déposer un commentaire

Créer un compte

Créez un compte sur notre communauté. C’est facile !

Créer un nouveau compte

Se connecter

Vous avez déjà un compte ? Connectez-vous ici.

Connectez-vous maintenant

  • En ligne récemment   0 membre est en ligne

    Aucun utilisateur enregistré regarde cette page.

×