[RESOLU] De la manipulation dynamique des listes de selection

Bonjour à tous,

j'ai quelques opérations à faire sur des <select>, en particulier une modification du contenu de la liste déroulante. Ci-dessous deux méthodes : la première modifie le contenu de la liste sur l'évenement onclick d'un bouton associé, la seconde modifie le contenu de la liste sur l'événement onclick de la liste elle-même :

<h2>Remplissage dynamique par clic sur bouton avec nettoyage de la liste</h2>
<select id='sel1a'>
	<option value='0'>option 0</option>
	<option value='10'>ligne à supprimer</option>
</select>
<button onclick="fillSelect1a()">Remplir</button>
<script language="javascript" type="text/javascript"><!--
function fillSelect1a() {
	var sel = document.getElementById('sel1a');
	sel.options.length = 1;
	sel.options[sel.options.length] = new Option('option 1', 1);
	sel.options[sel.options.length] = new Option('option 2', 2);
	sel.options[sel.options.length] = new Option('option 3', 3);
	sel.options[sel.options.length] = new Option('option 4', 4);
}
--></script>

<h2>Remplissage dynamique sur événement onclick avec nettoyage de la liste</h2>
<select id='sel2b' onclick='fillSelect2b();return true'>
	<option value='0'>option 0</option>
	<option value='10'>ligne à virer</option>
</select>
<script language="javascript" type="text/javascript"><!--
function fillSelect2b() {
	var sel = document.getElementById('sel2b');
	sel.options.length = 1;
	sel.options[sel.options.length] = new Option('option 1', 1);
	sel.options[sel.options.length] = new Option('option 2', 2);
	sel.options[sel.options.length] = new Option('option 3', 3);
	sel.options[sel.options.length] = new Option('option 4', 4);
}
--></script>

Dans les deux cas, le contenu de la liste déroulante est correctement mis à jour. Cependant, si je clique sur, disons, la ligne 'option 2'
- dans le premier cas, la ligne reste sélectionnée dans la combo (comportement normal)
- dans le second cas, la sélection reste bloquée sur la première ligne...

Petit bémol sur le second cas : si je recherche quelle est la ligne sélectionnée en interceptant le onchange du <select>, je trouve bien celle contenant 'option 2'. La sélection est donc correctement transmise mais elle se perd...

Pourquoi ?
Modifié par Herode (07 Nov 2007 - 16:58)

Problème règlé. Pour info, le souci vient du fait que lorsque l'on sélectionne une ligne dans la liste déroulante, l'événement onclick est appelé juste après le onchange.
Et comme je modifie le contenu de la liste dans le onclick...