remplir deux boîte de sélection à partir d'une boîte de sélection

Question

Je suis allé à travers ces sujets pour une solution à mon problème, mais je pense que ma question est un peu différente.

• Using javascript and jquery, to populate related select boxes with array structure
• Populating a 2nd select box - binding problem

J'ai 3 boîtes de sélection dans ma forme. Nommé 'Catégorie', 'Sous-catégorie', 'Sujet'.

La sous-catégorie est remplie à partir de la sélection de la catégorie et le sujet est sélectionné dans la zone de sélection de la sous-catégorie.

J'ai créé une fonction généralisée pour remplir des boîtes de sélection en utilisant jquery.

J'appelle cette fonction (populateSelectBox) sur l'événement change de la zone de sélection parent. Maintenant la zone de sélection Sous-catégorie est facilement renseignée sur l'événement de changement de la zone de sélection de catégorie mais si la sous-catégorie n'a qu'une seule option remplie par ajax, l'événement de changement pour la sous-catégorie n'est pas déclenché car il n'y a qu'un élément dans la sous-catégorie sélectionnez la case

Que dois-je faire dans ce cas?

S'il vous plaît aider

Answer 1

Vous pouvez tester le nombre d'options reçues et s'il n'y a qu'une seule, déclencher l'événement change manuellement:

$('#mySubCategorySelect').trigger('change'); 

ou tout simplement:

$('#mySubCategorySelect').change(); 

Une autre façon aller serait d'avoir un option en haut de chaque select qui est effectivement une vedette. Quelque chose comme:

<select> 
    <option>Please choose a category</option> 
    <option>some option</option> 
</select> 

Ceci nécessiterait que l'utilisateur choisisse une option, même si une seule existe.

Answer 2

Publier cette réponse comme il me fallait pour remplir la troisième boîte de sélection uniquement sur l'événement de changement de la deuxième boîte de sélection.

Merci à Patrick pour donner une idée de sélectionner l'option vide

Ainsi, au lieu d'ajouter un vide « sélectionnez l'option » par PHP, j'ai modifié ma fonction populateSelectBox de telle sorte qu'il ajoutera automatiquement une vide 'select' option à la réponse, comme ceci $element.append('<option value="">Select</option>'); afin que l'événement de changement peut être déclenché par l'utilisateur.