Implémentation dynamique de ShuttleBox en utilisant Javascript

Je suis à la recherche d'un morceau de javascript qui peut implémenter le type de fonctionnalité ShuttleBox.Implémentation dynamique de ShuttleBox en utilisant Javascript

Fondamentalement, je dois fournir 2 zone de liste et 4 boutons - Déplacer vers la gauche, Déplacer vers la droite, Déplacer tout vers la gauche et Déplacer tout vers la droite. Mais je veux mettre en œuvre ce morceau de dynamique de code afin qu'il puisse être réutilisé par objet dom juste de passage dans les paramètres seulement ...

Tout morceau de code ou d'un lien, serait très apprécié ...

Merci ...

Source

2010-11-23 Nirmal

double possible de [filtrables multi-sélection widget navette combobox/transfert] (http://stackoverflow.com/questions/13366940/filterable -multi-select-combobox-navette-transfert-widget) –

Voulez-vous dire quelque chose comme ça ?:

<html> 
<body> 

<script> 
function move_right() 
{ 
    var node = document.getElementById ("left"); 
    for (i=0; i < node.childNodes.length; i ++) 
    { 
     if (node.childNodes[i].selected) 
     { 
      document.getElementById ("right").appendChild(node.childNodes[i].cloneNode(true)); 
      node.removeChild (node.childNodes[i]); 
      -- i; 
     } 
    } 
} 

function move_left() 
{ 
    var node = document.getElementById ("right"); 
    for (i=0; i < node.childNodes.length; i ++) 
    { 
     if (node.childNodes[i].selected) 
     { 
      document.getElementById ("left").appendChild(node.childNodes[i].cloneNode(true)); 
      node.removeChild (node.childNodes[i]); 
      -- i; 
     } 
    } 
} 

function move_all_right() 
{ 
    var node = document.getElementById ("left");  
    while (node.childNodes.length > 0)   
    {   
     document.getElementById ("right").appendChild(node.firstChild.cloneNode(true)); 
     node.removeChild (node.firstChild);   
    }  
} 

function move_all_left() 
{ 
    var node = document.getElementById ("right");  
    while (node.childNodes.length > 0)   
    {   
     document.getElementById ("left").appendChild(node.firstChild.cloneNode(true)); 
     node.removeChild (node.firstChild);   
    }  
} 
</script> 
<select multiple="multiple" id="left"><option>item 0</option><option>item 1</option><option>item 2</option><option>item 3</option></select> 
<input type="button" value="<" onclick="move_left()"/> 
<input type="button" value="<<" onclick="move_all_left()"/> 
<input type="button" value=">>" onclick="move_all_right()"/> 
<input type="button" value=">" onclick="move_right()"/> 
<select multiple="multiple" id="right"></select> 

</body> 
</html>

Source

2010-11-23 13:26:05 atlavis

Implémentation dynamique de ShuttleBox en utilisant Javascript

Répondre

Questions connexes