Bagikan melalui


Menggunakan Postback dengan ReorderList (VB)

oleh Christian Wenz

Unduh PDF

Kontrol ReorderList di Toolkit Kontrol AJAX menyediakan daftar yang dapat diurutkan ulang oleh pengguna melalui seret dan letakkan. Setiap kali daftar diurutkan ulang, postback akan menginformasikan server perubahan.

Gambaran Umum

ReorderList Kontrol di Toolkit Kontrol AJAX menyediakan daftar yang dapat disusun ulang oleh pengguna melalui seret dan letakkan. Setiap kali daftar diurutkan ulang, postback akan menginformasikan server perubahan.

Langkah-langkah

Ada beberapa kemungkinan sumber data untuk kontrol.ReorderList Salah satunya adalah menggunakan XmlDataSource kontrol:

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

Untuk mengikat XML ini ke ReorderList kontrol dan mengaktifkan postback, atribut berikut harus diatur:

  • DataSourceID: ID sumber data
  • SortOrderField: Properti yang akan diurutkan berdasar
  • AllowReorder: Apakah akan mengizinkan pengguna menyusun ulang elemen daftar
  • PostBackOnReorder: Apakah akan membuat postback setiap kali daftar disusun ulang

Berikut adalah markup yang sesuai untuk kontrol:

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

ReorderList Dalam kontrol, data tertentu dari sumber data mungkin terikat menggunakan Eval() metode :

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

Pada posisi arbitrer di halaman, label akan menyimpan informasi ketika pengubahan ulang terakhir terjadi:

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

Label ini diisi dengan teks dalam kode sisi server, menangani postback:

<script runat="server">
 Sub Page_Load()
 If Page.IsPostBack Then
 lastUpdate.Text = "List last reordered at " & DateTime.Now.ToLongTimeString()
 End If
 End Sub
</script>

Terakhir, untuk mengaktifkan fungsionalitas ASP.NET AJAX dan Control Toolkit, ScriptManager kontrol harus diletakkan di halaman:

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

Setiap urutan ulang memicu postback

Setiap urutan ulang memicu postback (Klik untuk melihat gambar ukuran penuh)