Menggunakan Postback dengan ReorderList (C#)

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 harus memberi tahu server tentang perubahan tersebut.

Gambaran Umum

Kontrol ReorderList di Toolkit Kontrol AJAX menyediakan daftar yang dapat diurutkan ulang oleh pengguna melalui seret dan letakkan. Setiap kali daftar diurutkan ulang, postback harus memberi tahu server tentang perubahan tersebut.

Langkah-langkah

Ada beberapa kemungkinan sumber data untuk ReorderList kontrol. 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 untuk 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 pengulangan 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">
 void Page_Load()
 {
 if (Page.IsPostBack)
 {
 lastUpdate.Text = "List last reordered at " + 
 DateTime.Now.ToLongTimeString();
 }
 }
</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 (Klik untuk melihat gambar ukuran penuh)

Berikutnya