Использование обратных передач с помощью элемента управления ReorderList (C#)

  • Статья

Кристиан Венц (Christian Wenz)

Загрузить PDF-файл

Элемент управления ReorderList в наборе элементов управления AJAX предоставляет список, который может быть переупорядочен пользователем с помощью перетаскивания. Всякий раз, когда список переупорядочен, обратная связь должна информировать сервер об изменении.

Общие сведения

Элемент ReorderList управления в наборе элементов управления AJAX предоставляет список, который пользователь может изменить с помощью перетаскивания. Всякий раз, когда список переупорядочен, обратная связь должна информировать сервер об изменении.

Этапы

Существует несколько возможных источников данных для ReorderList элемента управления. Одним из них является использование XmlDataSource элемента управления :

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

Чтобы привязать этот XML-код к элементу ReorderList управления и включить обратную передачу, необходимо задать следующие атрибуты:

  • DataSourceID: идентификатор источника данных.
  • SortOrderField: свойство для сортировки.
  • AllowReorder: следует ли разрешить пользователю изменять порядок элементов списка.
  • PostBackOnReorder: следует ли создавать обратную передачу при переупорядочении списка.

Ниже приведена соответствующая разметка для элемента управления.

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

В элементе ReorderList управления определенные данные из источника данных могут быть привязаны с помощью Eval() метода :

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

В произвольном положении на странице метка будет содержать сведения, когда произошло последнее изменение порядка:

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

Эта метка заполняется текстом в коде на стороне сервера, обрабатывая обратную передачу:

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

Наконец, чтобы активировать функциональные возможности ASP.NET AJAX и control Toolkit, ScriptManager элемент управления необходимо поместить на страницу:

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

Каждое изменение порядка активирует обратную передачу

Каждое изменение порядка активирует обратную передачу (щелкните для просмотра полноразмерного изображения)

Вперед