CodeS-SourceS est hébergé par Frontier.fr

Ce site au démarrage

begin process at 2010 02 10 14:54:04

Accueil Codes Tutoriels Forum Livres Emploi Services Connexion

Trouver un code source :

dans

[ Dernières recherches ]

Accueil >

Formulaire

> ENVOI D'UNE LISTE À L'AUTRE + POSSIBLITÉ DE CLASSER UNE LISTE

ENVOI D'UNE LISTE À L'AUTRE + POSSIBLITÉ DE CLASSER UNE LISTE

Information sur la source

Note :

9,75 / 10

Catégorie :Formulaire Niveau :Initié Date de création :16/04/2004 Vu :6 435

Auteur : jdenoeud

Ecrire un message privé

Commentaire sur cette source (6)

Ajouter un commentaire et/ou une note

Description

Cliquez pour voir la capture en taille normale

Aprés avoir chercher un code entier de ce type de fonctionnalité, je n'ai trouvé que des fragments de code en javascript que j'ai compilé en une page.
Ce code permet de transférer d'une liste à l'autre un ou plusieurs éléments, de tout tranférer et d'ordonner dans la liste de droite.
Copier coller ce code dans un notepad et sauvegardez ce fichier en page.htm

Source

<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
function Deplacer(l1,l2)
{
for (i=0; i < l1.options.length ; i++)
{
if (l1.options(i).selected && l1.options(i)!= "" )
{
// alert ("toto");
// alert(l1.options(i).text);
// alert(l1.options(i).value);
o=new Option(l1.options(i).text,l1.options(i).value);
l2.options[l2.options.length]=o;
l1.options[i]=null;
i = i -1 ;
}
else
{
// alert("Aucun élément sélectionné");
}
}
}
function DeplacerTout(l1,l2)
{
for (i=0; i < l1.options.length ; i++)
{
// alert ("toto");
// alert(l1.options(i).text);
// alert(l1.options(i).value);
o=new Option(l1.options(i).text,l1.options(i).value);
l2.options[l2.options.length]=o;
l1.options[i]=null;
i = i -1 ;
}
}
function menuswitch(menu, way)
{
// Init
var menumax = menu.length -2;
var menusel = menu.selectedIndex;
// Debordement
if ((menusel < 0) || (menusel < 1 && way == -1) || (menusel > menumax && way == 1)) { return false; }
// Permutation
tmpopt = new Option( menu.options[menusel+way].text, menu.options[menusel+way].value );
menu.options[menusel+way].text = menu.options[menusel].text;
menu.options[menusel+way].value = menu.options[menusel].value;
menu.options[menusel+way].selected = true;
menu.options[menusel].text = tmpopt.text;
menu.options[menusel].value = tmpopt.value;
menu.options[menusel].selected = false;
return true;
}
function menusubmit(menu1,menu2)
{
var menulen1 = menu1.length;
for (i=0; i < menulen1; i++)
{
menu1.options[i].selected = true;
}
var menulen2 = menu2.length;
for (j=0; j < menulen2; j++)
{
menu2.options[j].selected = true;
}
}
//-->
</SCRIPT>
</head>
<body>
<FORM name="formulaire" action="page.htm" method"get" onSubmit="javascript:menusubmit(formulaire.listselect,formulaire.listunselect)">
<table border="0" cellpadding="0" cellspacing="1" width="400" height="150" bgcolor="#808080" >
<tr>
<td height="120" width="200">
<select name="listunselect" multiple width="200" size="10" OnDblClick="javascript:Deplacer(this.form.listunselect,this.form.listselect)" style="width:180px;font:normal Trebuchet MS;font-size: 9px;">
<option value="1">Element 1</option>
<option value="2">Element 2</option>
<option value="3">Element 3</option>
<option value="4">Element 4</option>
<option value="5">Element 5</option>
<option value="6">Element 6</option>
</select>
</td>
<td height="120" width="50" align="center">
<input value=" > " type="button" OnClick="javascript:Deplacer(this.form.listunselect,this.form.listselect)"><br>
<input value=" < " type="button" OnClick="javascript:Deplacer(this.form.listselect,this.form.listunselect)"><br>
<input value=">>" type="button" OnClick="javascript:DeplacerTout(this.form.listunselect,this.form.listselect)"><br>
<input value="<<" type="button" OnClick="javascript:DeplacerTout(this.form.listselect,this.form.listunselect)">
</td>
<td height="120" width="200">
<select name="listselect" multiple size="10" width="200" OnDblClick="javascript:Deplacer(this.form.listselect,this.form.listunselect)" style="width:180px;font:normal Trebuchet MS;font-size: 9px;">
<OPTION value="10">----------------------</OPTION>
</select>
</td>
<td height="120" width="50" align="center">
<input value=" /\ " type="button" onClick="javascript:menuswitch(this.form.listselect, -1)"><br>
<input value=" \/ " type="button" onClick="javascript:menuswitch(this.form.listselect, 1)">
</td>
</tr>
<tr>
<td height="30" width="400" colspan= 4 align="center"><input name="bSave" type="submit" value="Valider" style="width:180px;font:normal Trebuchet MS;font-size: 9px;"></td>
</tr>
</table>
<SCRIPT language="javascript">
// création d'une ligne pour initialiser la largeur puis suppression par ce javascript
document.formulaire.listselect.options.length=0;
</SCRIPT>
</form>
</body>
</html>

<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
function Deplacer(l1,l2)
{
 for (i=0; i < l1.options.length ; i++)
        {
        if (l1.options(i).selected && l1.options(i)!= "" )
         {
            // alert ("toto");
            // alert(l1.options(i).text);
            // alert(l1.options(i).value);
             o=new Option(l1.options(i).text,l1.options(i).value);
             l2.options[l2.options.length]=o;
             l1.options[i]=null;
             i = i -1 ;
          }
          else
          {
            // alert("Aucun élément sélectionné");
          }
         }
}

function DeplacerTout(l1,l2)
{
 for (i=0; i < l1.options.length ; i++)
        {

            // alert ("toto");
            // alert(l1.options(i).text);
            // alert(l1.options(i).value);
             o=new Option(l1.options(i).text,l1.options(i).value);
             l2.options[l2.options.length]=o;
             l1.options[i]=null;
             i = i -1 ;
          }
}

function menuswitch(menu, way)
{
    // Init
    var menumax = menu.length -2;
    var menusel = menu.selectedIndex;
    
    // Debordement
    if ((menusel < 0) || (menusel < 1 && way == -1) || (menusel > menumax && way == 1)) { return false; }

    // Permutation
    tmpopt = new Option( menu.options[menusel+way].text, menu.options[menusel+way].value );
    
    menu.options[menusel+way].text = menu.options[menusel].text; 
    menu.options[menusel+way].value = menu.options[menusel].value; 
    menu.options[menusel+way].selected = true;
    
    menu.options[menusel].text = tmpopt.text;                         
    menu.options[menusel].value = tmpopt.value;
    menu.options[menusel].selected = false;
    return true;
}

function menusubmit(menu1,menu2)
         {
             var menulen1 = menu1.length;
                 for (i=0; i < menulen1; i++)
                    {
                            menu1.options[i].selected = true;
                    }
             var menulen2 = menu2.length;
                 for (j=0; j < menulen2; j++)
                     {
                             menu2.options[j].selected = true;
                     }
         }
 //-->
</SCRIPT>
</head>
<body>
<FORM name="formulaire" action="page.htm" method"get" onSubmit="javascript:menusubmit(formulaire.listselect,formulaire.listunselect)">
<table border="0" cellpadding="0" cellspacing="1" width="400" height="150" bgcolor="#808080" >
  <tr>
    <td height="120" width="200">
        <select name="listunselect" multiple width="200" size="10" OnDblClick="javascript:Deplacer(this.form.listunselect,this.form.listselect)" style="width:180px;font:normal Trebuchet MS;font-size: 9px;">
            <option value="1">Element 1</option>
            <option value="2">Element 2</option>
            <option value="3">Element 3</option>
            <option value="4">Element 4</option>
            <option value="5">Element 5</option>
            <option value="6">Element 6</option>
        </select>
    </td>
    <td height="120" width="50" align="center">
    <input value="&nbsp;>&nbsp;" type="button" OnClick="javascript:Deplacer(this.form.listunselect,this.form.listselect)"><br>
    <input value="&nbsp;<&nbsp;" type="button" OnClick="javascript:Deplacer(this.form.listselect,this.form.listunselect)"><br>
    <input value=">>" type="button" OnClick="javascript:DeplacerTout(this.form.listunselect,this.form.listselect)"><br>
    <input value="<<" type="button" OnClick="javascript:DeplacerTout(this.form.listselect,this.form.listunselect)">
    </td>
    <td height="120" width="200">
    <select name="listselect" multiple size="10" width="200" OnDblClick="javascript:Deplacer(this.form.listselect,this.form.listunselect)" style="width:180px;font:normal Trebuchet MS;font-size: 9px;">
            <OPTION value="10">----------------------</OPTION>
    </select>
    
    </td>
    <td height="120" width="50" align="center">
        <input value="&nbsp;/\&nbsp;" type="button" onClick="javascript:menuswitch(this.form.listselect, -1)"><br>
    <input value="&nbsp;\/&nbsp;" type="button" onClick="javascript:menuswitch(this.form.listselect, 1)">
    </td>
  </tr>
  <tr>
    <td height="30" width="400" colspan= 4 align="center"><input name="bSave" type="submit" value="Valider" style="width:180px;font:normal Trebuchet MS;font-size: 9px;"></td>
  </tr>
</table>
  <SCRIPT language="javascript">
    // création d'une ligne pour initialiser la largeur puis suppression par ce javascript
    document.formulaire.listselect.options.length=0;
  </SCRIPT>
</form>

</body>

</html>

Conclusion

Merci au multiple sources trouvés sur internet.

Sources de la même categorie

CALCULS RAYNAUX V2 par Ali Bibi

VALIDATION D'UN FORMULAIRE par grarestephane

CHAT VIRTUEL par grarestephane

AJOUTER ET SUPPRIMER DES FICHIERS DANS UNE LISTE par grarestephane

TEXTAREA : LIMITER LA LARGEUR ET LA HAUTEUR DU TEXTE SAISIE par vilfarfadet

Toutes les sources de la catégorie Formulaire

Commentaires et avis

Commentaire de apxa le 19/04/2004 11:06:49

salut,
l'inconveniant de new Option c'est que sous mac ca délire et ca pete les tables.

Commentaire de supobi le 25/06/2004 16:49:35

Salut !

j essai d utiliser ce script pour mon site et je n arrive pas a recuperer la liste 2 sous forme de tableau ... j ai essaye de renomer la liste2 : listselect en listselect[] mais le script ne marche plus ...

je genere le code avec du php suite a un recup de donnee ds une base. Apres le Submit je doit recuperer la liste 2 et traiter chaque selection separement.

Merci pour votre aide :)

Commentaire de thralia le 17/02/2005 13:25:13

Merci pour cette source !!!! C'est exactement ce que jattendais. Un tel traitement n'est pas possible en asp, donc je me suis 'rabattu' sur le javascript, mais je ne regrette rien
Encore merci !
Mika

Commentaire de tembargo le 15/03/2005 00:42:14

Simple, efficace et facile à adapter à sa sauce :)
Seul reproche, pour les tableaux : avec Firefox l'appel à "options(i)" ne fonctionne pas (sous IE, c'est ok), il remplacer les () par des [] et ça marche nikel.
Voilou. ++

Commentaire de S4RuM4N le 30/04/2005 10:53:37

Cool, exactement ce que je cherchait :D

en plus, il est un peu plus complet que les autres scripts que j'avais vu !

Bravo !

Commentaire de caviar le 12/09/2007 12:12:20

impec !! merci !
plus qu'à implémenter un moteur de filtrage dans la liste de gauche ;)
++

Ajouter un commentaire

Nos sponsors

Derniers Blogs

TECHDAYS PARIS 2010 : SHAREPOINT 2010 POUR LES DéVELOPPEURS par ROMELARD Fabrice

TECHDAYS PARIS 2010 : PLEINIèRE DERNIER JOUR par ROMELARD Fabrice

UNE JOLIE-HORLOGE ET PAS QU'UN PEU ! par neodante

TECHDAYS PARIS 2010 : CONNECTEZ VOS DONNéES à SHAREPOINT 2010 AVEC LES BUSINESS CONNECTIVITY SERVICES par ROMELARD Fabrice

[DIVERS] SUIVRE VOS SéRIES PRéFéRéS SUR LA TOILE par orion

Forum

RE : COUPER UNE PARTIE DE CHAINE par nhervagault

COUPER UNE PARTIE DE CHAINE par bydouille

JE VEUX LE CODE D'ANNIMATION AVEC JAVASCRIPT par dalinda

J'AI TROUVéE UN CODE SOURCE SUR INTERNET ET J'AI PAS LE COMPRIS par dalinda

RE : RéCUPERER LA TAILLE D'UN DIV par bumbo

Côté IT

Offres d'emploi

Formations Video

Appels d'offres

Cherche formation complete en GIMP
Budget : 750€
Module sur Prestashop
Budget : 700€
Redaction d-une page de vente pour un ebook
Budget : 300€

Logiciels

DB-MAIN (9.1.0)
DB-MAIN (9.1.0)

DB-MAIN is a data-modeling and data-architecture tool. It is designed to help developers and anal...

Cliquez pour télécharger DB-MAIN
Xilisoft DPG Convertisseur (5.1.37.0120)
XILISOFT DPG CONVERTISSEUR (5.1.37.0120)

Xilisoft DPG Convertisseur offre aux fans de Nintendo DS une bonne solution leur permettant de dé...

Cliquez pour télécharger Xilisoft DPG Convertisseur
GraphicsGale (2.01.01)
GRAPHICSGALE (2.01.01)

GraphicsGale est un logiciel de PixelArt avec de nombreuse fonctionnalités permettant de réalisé ...

Cliquez pour télécharger GraphicsGale
Architecte 3D (Platinum 2010)
ARCHITECTE 3D (PLATINUM 2010)

Architecte 3D Platinium vous permet de concevoir facilement les plans votre future maison, de l'é...

Cliquez pour télécharger Architecte 3D
TeamViewer 5 (TeamViewer 5)
TEAMVIEWER 5 (TEAMVIEWER 5)

Dépanner un ami,expliquer une manipulation devient un jeu d'enfant. Prise en main d'un autre ord...

Cliquez pour télécharger TeamViewer 5