Partilhar via

Uso de postbacks com ReorderList (C#)

  • Artigo

por Christian Wenz

Baixar PDF

O controle ReorderList no Kit de Ferramentas de Controle AJAX fornece uma lista que pode ser reordenada pelo usuário por meio de arrastar e soltar. Sempre que a lista for reordenada, um postback informará o servidor sobre a alteração.

Visão geral

O ReorderList controle no Kit de Ferramentas de Controle AJAX fornece uma lista que pode ser reordenada pelo usuário por meio de arrastar e soltar. Sempre que a lista for reordenada, um postback informará o servidor sobre a alteração.

Etapas

Há várias fontes de dados possíveis para o ReorderList controle. Uma delas é usar um XmlDataSource controle:

<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>

Para associar esse XML a um ReorderList controle e habilitar postbacks, os seguintes atributos devem ser definidos:

  • DataSourceID: a ID da fonte de dados
  • SortOrderField: a propriedade a ser classificada por
  • AllowReorder: se deseja permitir que o usuário reordene os elementos da lista
  • PostBackOnReorder: se deseja criar um postback sempre que a lista for reorganizada

Aqui está a marcação apropriada para o controle:

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

Dentro do ReorderList controle, dados específicos da fonte de dados podem ser associados usando o Eval() método :

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

Em uma posição arbitrária na página, um rótulo manterá as informações quando a última reordenação ocorreu:

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

Esse rótulo é preenchido com texto no código do lado do servidor, tratando o postback:

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

Por fim, para ativar a funcionalidade do AJAX ASP.NET e do Kit de Ferramentas de Controle, o ScriptManager controle deve ser colocado na página:

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

Cada reordenação dispara um postback

Cada reordenação dispara um postback (Clique para exibir imagem em tamanho real)

Próximo