Ajouter/Supprimer des éléments d'un contrôle ListBox à un autre contrôle ListBox dans ASP.NET du côté client

Question

Je déplace itmes d'un contrôle ASP.NET ListBox vers un autre contrôle ListBox du côté client. Cela fonctionne sur le côté client mais quand j'ai essayé de compter les éléments dans ListBox sur le côté serveur, c'est toujours rien. Ci-dessous, le code jQuery est utilisé pour ajouter/supprimer des éléments du contrôle ListBox.

<script type="text/javascript"> 
    $(document).ready(function(addToList) { 
    // to move selected item from lbSource to lbDestination 
    $("#add").click(function() { 
    $("#lbSource option:selected").appendTo("#lbDestination").attr("selected", false); 
    }); 

    // to remove selected item from lbDestination to lbSource 
    $("#remove").click(function() { 
    $("#lbDestinaion option:selected").appendTo("#lbSource").attr("selected", false); 
    }); 
}); 
</script> 

Je sais que nous pouvons ajouter/supprimer des éléments de ListBox à partir du serveur. Mais j'aimerais le faire du côté client. Pourquoi il n'y a rien dans le ListBox de destination lors du comptage des éléments du code-behind, même si les éléments sont déjà ajoutés du côté client.

Answer 1

Les modifications Javascript effectuées sur les contrôles ne seront pas affichées côté serveur. Je pense que c'est lié au cercle de vie asp.net. Cependant, il est montré dans les champs cachés. Vous pouvez donc le suivre du côté serveur si vous ajoutez des informations dans des champs cachés supplémentaires, par exemple vous pouvez enregistrer les identifiants ou les noms des options dans des champs cachés.

Answer 2

Même s'il est affiché du côté client, il n'est pas soumis au serveur, les valeurs ne sont pas mises à jour dans le serveur.Est-ce que vous effectuez une action pour mettre à jour la liste?

Si vous voulez faire ceci avec la page de soumission, utilisez Ajax.

Answer 3

Je crains que vous ayez besoin d'utiliser un panneau de mise à jour pour permettre au serveur de suivre les changements d'état des contrôles.

Serverside:

protected void btnMove_OnClick(object sender, EventArgs Args) 
{ 
    ListItem SourceItem = bSource.SelectedItem; 

    lbDestination.Items.Add(SourceItem); 
    lbSource.Items.Remove(SourceItem); 
} 

Majoration:

<asp:UpdatePanel ChildrenAsTriggers="true" runat="Server"> 
    <ContentTemplate> 

    <asp:ListBox ID="lbSource" runat="server"/> 
    <asp:Button ID="btnMove" OnClick="btnMove_OnClick" runat="server"/> 
    <asp:ListBox ID="lbDestination" runat="server"/> 

    </ContentTemplate> 
</asp:UpdatePanel>