Gestion de 2 select multiple - compatible ie & ff

Soyez le premier à donner votre avis sur cette source.

Vue 20 647 fois - Téléchargée 12 456 fois

Description

Voila ce code permet d'échanger les champs entre deux select(selection_champs()) et de gérer l'odre dans lequel ils sont affichés(priorite_champ).

De plus, lors de l'envoie du formulaire la fontion select_all() permet de vous envoyer le contenu des deux select sous forme de tableau que vous pourrez exploiter à votre guise.

Voilà, j'espère que cela servira. :)

P.s: j'ai testé ce code avec FF 1.5.0.1 et IE 6

Source / Exemple :


<script styles="text/javascript">
function selection_champs(champs,champs_affiche){
   //on récupère l'endroit sélectionner dans le select source
    selection = champs.selectedIndex;
    if(selection != -1){
        //on déselectionne tous les champs du select de destination où va être placer le(s) champ(s) selectionner
        while(champs_affiche.selectedIndex != -1){
            champs_affiche.options[champs_affiche.selectedIndex].selected = false;
        }

        while(champs.selectedIndex > -1){
            if(champs.options[champs.selectedIndex].value == "Id_type_bien"){
                champs.options[champs.selectedIndex] = null;
                champs.form.Id_categorie_bien.options[0].select= true;
            }else{
                //on cherche la place de notre champ
                for(place=0;place<champs_affiche.length;place++){
                    if(champs_affiche.options[place].text > champs.options[champs.selectedIndex].text){
                        break;
                    }
                }
                //on décale tous les champs
                for(i=champs_affiche.length;i>place;i--){
                    champs_affiche.options[i] = new Option(champs_affiche.options[(i-1)].text,champs_affiche.options[(i-1)].value);
                }

                //on insère le champ selectionner
                champs_affiche.options[place] = new Option(champs.options[champs.selectedIndex].text,champs.options[champs.selectedIndex].value);
                champs.options[champs.selectedIndex] = null;
                champs_affiche.options[place].selected = true;
            }
        }

        if(champs.length > 0){
            if(selection >= champs.length ){
                selection = champs.length-1;
            }
            champs.options[selection].selected = true;
        }
    }
}

function select_all(frm){
    for(i=0;i<frm.liste_champs.length;i++){
        frm.liste_champs.options[i].selected = true;
    }
    frm.liste_champs.name = "liste_champs[]";

    for(i=0;i<frm.selection.length;i++){
        frm.selection.options[i].selected = true;
    }
    frm.selection.name = "selection[]";
}

function priorite_champ(selection,mode){
    if(selection.length < 2 ){return;}
    old_place = selection.selectedIndex;
    if(mode == 'up' && old_place > 0){
        new_place = old_place-1;
    }else if(mode == 'down' && old_place < selection.length-1){
        new_place = old_place+1;
    }
    
    tmp = new Option(selection.options[new_place].text,selection.options[new_place].value);
    selection.options[new_place] = new Option(selection.options[old_place].text,selection.options[old_place].value);
    selection.options[old_place] = new Option(tmp.text,tmp.value);
    selection.options[new_place].selected = true;
}
</script>

Codes Sources

A voir également

Ajouter un commentaire

Commentaires

tiflo7411
Messages postés
1
Date d'inscription
mercredi 22 juin 2011
Statut
Membre
Dernière intervention
22 juin 2011
-
Bonjour à tous !!

Vous voulez encore plus simple ? Je ne suis pas un expert, mais j'ai trouvé un truc pas tant mal ! (Je sais le dernier post date un peu... mais bon si ça peut aider certains...)

En fait, dans votre formulaire, au lieu d'avoir les lignes du <select> comme ceci '<option>Option 1</option>', préciser l'attribut value="", ce qui nous donne ==> '<option value="Option 1">Option 1</option>'. Et sans faire de checkbox en javascript ou quoi, quand vous lancer votre formulaire et que vous faites un print_r() de la liste, vous vous apercevrez qu'il vous affichera bien les value de votre select :)

Bonne journée et continuation à tous !
Dav_c
Messages postés
194
Date d'inscription
dimanche 25 janvier 2004
Statut
Membre
Dernière intervention
11 décembre 2015
-
merci
zerros
Messages postés
4
Date d'inscription
samedi 13 septembre 2003
Statut
Membre
Dernière intervention
26 février 2017
-
Bonjour,

J'ai un souci avec ce fonctionnement. J'ai un formulaire me permettant d'envoyer un certain nombre de champs à uns script php.
Le hic, c'est qu'ayant déjà un formulaire, il m'est inpossible d'imbriquer le formulaire de ce code dans mon formulaire existant.

N'étant pas fortiche en javascript, Je voudrai savoir comment dois-je proceder pour ajouter ces deux listes dans mon formulaire existant ?

J'espère que vous pourrez m'aider.
biologie20002000
Messages postés
1
Date d'inscription
lundi 14 janvier 2008
Statut
Membre
Dernière intervention
3 août 2008
-
bonjour,
un bon script. moi ma question : est ce que c'est possible de conservé autrement dit de sauvgarder la selection même apres fermeture de la fenetre. comme si on fait un cookie sur la selection.
si quelqu'un à une idée ça va m'aidé dans mon select que je veux utiliser pour mon site.
merci
cs_djtale
Messages postés
5
Date d'inscription
mardi 17 juin 2003
Statut
Membre
Dernière intervention
12 juin 2008
-
Bonjour,

je voulais savoir conserver dans le select de gauche les éléments que l'on passe dans le select de droite..
Mo objectif est en fait de pouvoir mettre dans le select de droite plusieurs fois le même élément.

Merci bcp.

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Du même auteur (BiBi FocK)