Ajouter une Option dans un Select Résolu

Question

Hello,

J'ai un petit script qui fonctionne tres bien avec Internet Explorer, mais qui bug avec Firefox Mozilla. J'essaie d'ajouter et d'enlever des Options dans un Select de maniere dynamique. J'utilise les fonctions javascript add() et remove() comme mentionne a l'adresse suivante : http://www.w3schools.com/htmldom/dom_obj_select.asp . Y'a-t-il un moyen de faire fonctionner tout ca sur Firefox?

Merci de votre aide...
FD

darb66 · Accepted Answer

Merci pour votre aide... j'ai remplace la fonction Add() en creant une nouvelle option que j'ajoute dans le tableau options[] de mon Select. Exemple:

Avant => document.getElementById(select_name).add(new Option(text, value), i); // Fonctionne seulement avec ie
Apres => document.getElementById(select_name).options[i] = new Option(text, value); // Fonctionne avec ie et ff

Remarque: La solution proposee permet de modifier l'option a l'indice i. Contrairement a la fonction add(), les options contenues dans le Select ne sont pas decalees...

cs_bultez · Answer

Bonjour,
   remove(), par exemple, fonctionne tr&#232;s bien aussi avec FF [ pas test&#233; add() ]
   comment dire ce qui cloche sans un petit bout d'extrait de script ?
Cordialement. Bul. ~

Phil_Free · Answer

Salut, Sur la page que tu cites, il est bien indiqué que add() ne fonctionne ni sous FF ni sous Netscape: Select Object Methods Method | Description | IE | F | N | W3C | ---- add(), Adds an option to the dropdown list, 4, , , Yes, ---- blur(), Removes focus from the dropdown list, 4, 1, 3, Yes, ---- focus(), Sets focus on the dropdown list, 4, 1, 3, Yes, ---- remove(), Removes an option from the dropdown list, 4, 1, 6, Yes Par contre tu peux sans doute utiliser ceci : Soit l'exemple suivant: Pour suprimer une option: document.forms['testform'].testselect.options[i] = null; Pour créer une option: document.forms['testform'].testselect.options[i] = new Option('nouveau texte','nouvelle value');

Phil_Free · Answer

Si tu veux rester dans les standards, tu peux aussi utiliser ceci: elOptNouv.text = 'Option3'; elOptNouv.value = 'Opt3'; try { document.getElementById('selectX').add(elOptNouv, null); // ne fonctionne pas sous IE } catch(ex) { document.getElementById('selectX').add(elOptNouv); // fonctionne sous IE seulement } Mais alors il faut donner un id à ton select, comme ça:

pagextchab2 · Answer

Voilà mon code et explorer tombe dans le catch mais n'affiche aucune erreur :

        var elOptNouv = document.createElement('OPTION');
        
        elOptNouv.text = 'AUCUNE LISTE';
        elOptNouv.value = '0';
        
        try {
            w.forms["frm"].document.getElementById(strElement).add(elOptNouv);
        }
        catch(error) { 
            
            alert(error.message);
        } 

 S.V.P. Venz à ma recousse !!!

darb66 · Answer

Si tu accedes au select en utilisant document.getElementById() alors il n'est pas necessaire de faire appelle a w.forms['']
J'imagine que c'est ce qui provoque l'erreur... et je pense que FF generera egalement un message d'erreur (souvent plus explicite d'ailleurs ).

pagextchab2 · Answer

Le probleme que je dois accéder à une fenêtre enfant : voici le code de ma fonction pour mieux t eclairer :

//Initialisation
    w = window.opener.document;
    d = document.frm;
    
 //Sélection de la liste des options de combo
 ary_List=w.forms["frm"].elements["hid_List"].value.split(";");
 
 //Parcours du tableau de la liste des combo
 for(int_I=0; int_I<ary_List.length; int_I++){

     //Sélection de la liste des options de combo
     ary_Detail=ary_List[int_I].split("¤");   
     
     //Définition du combo à remettre à jour
     strElement="cbo_List"+ary_Detail[0];
     
     //Réinitialisation du combo
     w.forms["frm"].elements[strElement].length=0;
     
     w.forms["frm"].elements[strElement].options[0] = new Option("AUCUNE LISTE","0");

CELUI-CI MARCHE EN FIRFOX MAIS PAS EN IE

darb66 · Answer

Dans ton 2eme exemple, pourrais-tu signaler a quel moment l'erreur est produite? Es-tu certain que w n'est pas "undefine"? Essaies de deboguer ton code en verifiant si toutes tes declarations sont valides:
alert(w);
alert(ary_List);
alert(ary_Detail);
alert(strElement);

Peut-etre as-tu une valeur corrompue mais a premiere vue je dirais sinon que le code est correct. Que se passe-t-il si tu enleves la ligne: w.forms["frm"].elements[strElement].length=0; ?

pagextchab2 · Answer

Non, de ce côté, tout est ok. C'est vraiment le code (add) en internet explorer qui pose problème.

darb66 · Answer

As-tu essaye d'enlever la ligne w.forms["frm"].elements[strElement].length= 0; ? Est-ce qu'au moins tu arrives a changer le texte et la valeur d'une option?

J'essaierais de changer comme ca:

w.forms["frm"].elements[strElement].length =  1 
;
et ensuite
w.forms["frm"].elements[strElement].options[0]  = new Option("AUCUNE LISTE","0");
ou
w.forms["frm"].elements[strElement].options[0].text = "AUCUNE LISTE";
w.forms["frm"].elements[strElement].options[0].value = 0;

Ajouter une Option dans un Select

10 réponses

Votre réponse

Discussions similaires