J'ai deux zones de liste (A, B) avec des valeurs et je peux envoyer des valeurs de A à B ou B à A

Question

J'ai deux zones de liste (A, B) avec des valeurs et je peux envoyer des valeurs de A à B ou B à A et j'ai un bouton de sauvegarde.

Pour la première fois sans mettre à jour une zone de liste si je clique sur le bouton Enregistrer je montre un message comme « Aucun changement ou DONE »

Mais une fois que j'envoie un élément de A à B et envoyer à nouveau ce même article de B à A cela signifie pas de changements ou fait. ici aussi je veux montrer le même message "AUCUN changement ou fait". mais je suis incapable d'affiner le staus peut-on donner du code ou des conseils pour trouver le statut par défaut pour les listboxs en javascript.

Merci

Answer 1

Je ne sais pas pourquoi vous voulez faire avec javascript côté client, mais voici un exemple: lbClicked est une js-fonction qui est appelée onclick sur les éléments des listes déroulantes pour supprimer les éléments et ajoutez-les à l'autre listbox. Le plus important est que j'ai enregistré deux javascript-arrays sur le serveur (Lb1Items et Lb2Items), ils contiennent les valeurs des items de la listbox. Lorsque l'utilisateur clique sur le bouton de soumission (ou quoi que ce soit), je compare chaque zone de liste avec le tableau correspondant. Quand tout est pareil rien n'a été changé.

function lbClicked(sender){ 
     var lb1=document.getElementById("ListBox1"); 
     var lb2=document.getElementById("ListBox2"); 
     if(lb1 != null && lb2 != null){ 
      if(sender==lb1){ 
       var selectedItem=lb1.item(lb1.selectedIndex); 
       if(! contains(Lb2Items,selectedItem.value)){ 
        lb1.remove(lb1.selectedIndex); 
        lb2.add(selectedItem); 
       } 
      }else if(sender==lb2){ 
       var selectedItem=lb2.item(lb2.selectedIndex); 
       if(! contains(Lb1Items,selectedItem.value)){ 
        lb2.remove(lb2.selectedIndex); 
        lb1.add(selectedItem); 
       } 
      } 
     } 
    } 


    function Button1_onclick() { 
     var changed=itemsChanged(); 
     if(changed) 
      alert("Items Changed!"); 
     else 
      alert("Items not changed!"); 
     return changed; 
    } 

    function itemsChanged(){ 
     if(Lb1Items != null && Lb2Items != null){ 
      var lb1=document.getElementById("ListBox1"); 
      var lb2=document.getElementById("ListBox2"); 
      if(lb1 != null && lb2 != null){ 
       if(lb1.options.length != Lb1Items.length || lb2.options.length != Lb2Items.length) 
        return true; 

       for(var i=0; i<lb1.options.length; i++){ 
        var item=lb1.options[i]; 
        if(! contains(Lb1Items,item.value)) 
         return true; 
       } 
       for(var i=0; i<lb2.options.length; i++){ 
        var item=lb2.options[i]; 
        if(! contains(Lb2Items,item.value)) 
         return true; 
       } 
      } 
     } 
     return false; 
    } 

    function contains(objArray,objectToFind){ 
     for(var i=0;i<objArray.length;i++){ 
       if(objArray[i]==objectToFind) 
        return true; 
     } 
     return false; 
    } 

testé avec ASP.Net:

<form id="form1" runat="server"> 
     <asp:ListBox ID="ListBox1" runat="server" onclick="javascript:lbClicked(this);" Height="84px"> 
      <asp:ListItem Text="Item 1" Value="1"></asp:ListItem> 
      <asp:ListItem Text="Item 2" Value="2"></asp:ListItem> 
      <asp:ListItem Text="Item 3" Value="3"></asp:ListItem> 
      <asp:ListItem Text="Item 4" Value="4"></asp:ListItem> 
      <asp:ListItem Text="Item 5" Value="5"></asp:ListItem> 
     </asp:ListBox>&nbsp; 
     <asp:ListBox ID="ListBox2" runat="server" onclick="javascript:lbClicked(this);" Height="82px"> 
      <asp:ListItem Text="Item 6" Value="6"></asp:ListItem> 
      <asp:ListItem Text="Item 7" Value="7"></asp:ListItem> 
      <asp:ListItem Text="Item 8" Value="8"></asp:ListItem> 
      <asp:ListItem Text="Item 9" Value="9"></asp:ListItem> 
      <asp:ListItem Text="Item 10" Value="10"></asp:ListItem> 
     </asp:ListBox> 
     &nbsp; 
     <input id="Button1" type="button" value="button" onclick="return Button1_onclick()" /> 
    </form> 

et le tableau ont été enregistrés sur le serveur côté de cette façon:

ClientScript.RegisterArrayDeclaration("Lb1Items", "1,2,3,4,5") 
ClientScript.RegisterArrayDeclaration("Lb2Items", "6,7,8,9,10") 

Cordialement, Tim

EDIT: vérification supplémentaire pour le nombre d'éléments identiques dans itemsChanged-function et che ck si la zone de liste cible contient déjà l'élément à transférer