Uso di postback con ReorderList (C#)

di Christian Wenz

Scarica il PDF

Il controllo ReorderList in AJAX Control Toolkit fornisce un elenco che può essere riordinato dall'utente tramite trascinamento della selezione. Ogni volta che l'elenco viene riordinato, un postback informa il server della modifica.

Panoramica

Il ReorderList controllo in AJAX Control Toolkit fornisce un elenco che può essere riordinato dall'utente tramite trascinamento della selezione. Ogni volta che l'elenco viene riordinato, un postback informa il server della modifica.

Passaggi

Sono disponibili diverse origini dati possibili per il ReorderList controllo. Uno consiste nell'usare un XmlDataSource controllo:

<asp:XmlDataSource ID="XmlDataSource1" runat="server" XPath="acronym/letter">
 <Data>
 <acronym>
 <letter char="A" description="Asynchronous" />
 <letter char="J" description="JavaScript" />
 <letter char="A" description="And" />
 <letter char="X" description="XML" />
 </acronym>
 </Data>
</asp:XmlDataSource>

Per associare il codice XML a un ReorderList controllo e abilitare i postback, è necessario impostare gli attributi seguenti:

  • DataSourceID: ID dell'origine dati
  • SortOrderField: proprietà in base alla quale eseguire l'ordinamento
  • AllowReorder: indica se consentire all'utente di riordinare gli elementi dell'elenco
  • PostBackOnReorder: indica se creare un postback ogni volta che l'elenco viene riorganiato

Ecco il markup appropriato per il controllo:

<ajaxToolkit:ReorderList ID="rl1" runat="server" SortOrderField="char"
 AllowReorder="true"
 DataSourceID="XmlDataSource1" PostBackOnReorder="true">

All'interno del ReorderList controllo, è possibile associare dati specifici dell'origine dati usando il Eval() metodo :

<DragHandleTemplate>
 <div class="DragHandleClass">
 </div>
 </DragHandleTemplate>
 <ItemTemplate>
 <div>
 <asp:Label ID="ItemLabel" Text='<%# Eval("description") %>' runat="server" />
 </div>
 </ItemTemplate>
</ajaxToolkit:ReorderList>

In una posizione arbitraria nella pagina, un'etichetta conterrà le informazioni quando si è verificato l'ultimo riordinamento:

<div>
 <asp:Label ID="lastUpdate" runat="server" />
</div>

Questa etichetta viene compilata con testo nel codice lato server, che gestisce il postback:

<script runat="server">
 void Page_Load()
 {
 if (Page.IsPostBack)
 {
 lastUpdate.Text = "List last reordered at " + 
 DateTime.Now.ToLongTimeString();
 }
 }
</script>

Infine, per attivare la funzionalità di ASP.NET AJAX e Control Toolkit, il ScriptManager controllo deve essere inserito nella pagina:

<asp:ScriptManager ID="asm" runat="server" />

Ogni riordinamento attiva un postback

Ogni riordinamento attiva un postback (fare clic per visualizzare l'immagine a dimensione intera)