Bagikan melalui

Membangun Antarmuka untuk Memilih Satu Akun Pengguna dari Banyak (C#)

oleh Scott Mitchell

Dalam tutorial ini kita akan membangun antarmuka pengguna dengan kisi halaman yang dapat difilter. Secara khusus, antarmuka pengguna kami akan terdiri dari serangkaian LinkButtons untuk memfilter hasil berdasarkan huruf awal nama pengguna, dan kontrol GridView untuk menampilkan pengguna yang cocok. Kita akan mulai dengan mencantumkan semua akun pengguna di GridView. Kemudian, di Langkah 3, kita akan menambahkan filter LinkButtons. Langkah 4 melihat halaman hasil yang difilter. Antarmuka yang dibangun dalam Langkah 2 hingga 4 akan digunakan dalam tutorial berikutnya untuk melakukan tugas administratif untuk akun pengguna tertentu.

Pengantar

Dalam tutorial Menetapkan Peran ke Pengguna, kami membuat antarmuka dasar bagi administrator untuk memilih pengguna dan mengelola perannya. Secara khusus, antarmuka menyajikan administrator dengan daftar drop-down semua pengguna. Antarmuka seperti itu cocok ketika ada tetapi selusin atau lebih akun pengguna, tetapi sulit untuk situs dengan ratusan atau ribuan akun. Kisi halaman yang dapat difilter lebih cocok untuk antarmuka pengguna untuk situs web dengan basis pengguna besar.

Dalam tutorial ini kita akan membangun antarmuka pengguna seperti itu. Secara khusus, antarmuka pengguna kami akan terdiri dari serangkaian LinkButtons untuk memfilter hasil berdasarkan huruf awal nama pengguna, dan kontrol GridView untuk menampilkan pengguna yang cocok. Kita akan mulai dengan mencantumkan semua akun pengguna di GridView. Kemudian, di Langkah 3, kita akan menambahkan filter LinkButtons. Langkah 4 melihat halaman hasil yang difilter. Antarmuka yang dibangun dalam Langkah 2 hingga 4 akan digunakan dalam tutorial berikutnya untuk melakukan tugas administratif untuk akun pengguna tertentu.

Mari kita mulai!

Langkah 1: Menambahkan Halaman ASP.NET Baru

Dalam tutorial ini dan dua berikutnya kita akan memeriksa berbagai fungsi dan kemampuan terkait administrasi. Kita akan membutuhkan serangkaian halaman ASP.NET untuk mengimplementasikan topik yang diperiksa di seluruh tutorial ini. Mari kita buat halaman ini dan perbarui peta situs.

Mulailah dengan membuat folder baru dalam proyek bernama Administration. Selanjutnya, tambahkan dua halaman ASP.NET baru ke folder, menautkan setiap halaman dengan Site.master halaman master. Beri nama halaman:

  • ManageUsers.aspx
  • UserInformation.aspx

Tambahkan juga dua halaman ke direktori akar situs web: ChangePassword.aspx dan RecoverPassword.aspx.

Keempat halaman ini harus, pada titik ini, memiliki dua kontrol Konten, satu untuk masing-masing ContentPlaceHolders halaman master: MainContent dan LoginContent.

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="LoginContent" Runat="Server">
</asp:Content>

Kami ingin memperlihatkan markup default halaman master untuk LoginContent ContentPlaceHolder untuk halaman ini. Oleh karena itu, hapus markup deklaratif untuk Content2 kontrol Konten. Setelah melakukannya, markup halaman hanya boleh berisi satu kontrol Konten.

Halaman ASP.NET dalam Administration folder hanya ditujukan untuk pengguna administratif. Kami menambahkan peran Administrator ke sistem dalam tutorial Membuat dan Mengelola Peran; membatasi akses ke dua halaman ini ke peran ini. Untuk mencapai hal ini, tambahkan Web.config file ke Administration folder dan konfigurasikan elemennya <authorization> untuk memasukkan pengguna dalam peran Administrator dan untuk menolak semua yang lain.

<?xml version="1.0"?>
<configuration>
 <system.web>
 <authorization>
 <allow roles="Administrators" />
 <deny users="*"/>
 </authorization>
 </system.web>
</configuration>

Pada titik ini Penjelajah Solusi proyek Anda akan terlihat mirip dengan cuplikan layar yang ditunjukkan pada Gambar 1.

Empat Halaman Baru dan File Web.config Telah Ditambahkan ke Situs Web

Gambar 1: Empat Halaman Baru dan Web.config File Telah Ditambahkan ke Situs Web (Klik untuk melihat gambar ukuran penuh)

Terakhir, perbarui peta situs (Web.sitemap) untuk menyertakan entri ke ManageUsers.aspx halaman. Tambahkan XML berikut setelah <siteMapNode> kami menambahkan untuk tutorial Peran.

<siteMapNode title="User Administration" url="~/Administration/ManageUsers.aspx"/>

Dengan peta situs yang diperbarui, kunjungi situs melalui browser. Seperti yang ditunjukkan Gambar 2, navigasi di sebelah kiri sekarang menyertakan item untuk tutorial Administrasi.

Peta Situs Menyertakan Simpul Berjudul Administrasi Pengguna

Gambar 2: Peta Situs Menyertakan Simpul Berjudul Administrasi Pengguna (Klik untuk melihat gambar ukuran penuh)

Langkah 2: Mencantumkan Semua Akun Pengguna di GridView

Tujuan akhir kami untuk tutorial ini adalah untuk membuat kisi halaman yang dapat difilter di mana administrator dapat memilih akun pengguna untuk dikelola. Mari kita mulai dengan mencantumkan semua pengguna di GridView. Setelah ini selesai, kami akan menambahkan antarmuka dan fungsionalitas pemfilteran dan paging.

ManageUsers.aspx Buka halaman di Administration folder dan tambahkan GridView, atur ID ke UserAccounts. Dalam sesaat, kita akan menulis kode untuk mengikat kumpulan akun pengguna ke GridView menggunakan Membership metode kelas GetAllUsers . Seperti yang dibahas dalam tutorial sebelumnya, metode GetAllUsers mengembalikan MembershipUserCollection objek , yang merupakan kumpulan MembershipUser objek. Masing-masing MembershipUser dalam koleksi mencakup properti seperti UserName, , EmailIsApproved, dan sebagainya.

Untuk menampilkan informasi akun pengguna yang diinginkan di GridView, atur properti GridView AutoGenerateColumns ke False dan tambahkan BoundFields untuk UserNameproperti , , Emaildan Comment dan dan CheckBoxFields untuk IsApprovedproperti , , IsLockedOutdan IsOnline . Konfigurasi ini dapat diterapkan melalui markup deklaratif kontrol atau melalui kotak dialog Bidang. Gambar 3 memperlihatkan cuplikan layar kotak dialog Bidang setelah kotak centang Buat otomatis bidang tidak dicentang dan BoundFields dan CheckBoxFields telah ditambahkan dan dikonfigurasi.

Tambahkan Tiga BoundFields dan Tiga CheckBoxFields ke GridView

Gambar 3: Tambahkan Tiga BoundFields dan Tiga CheckBoxFields ke GridView (Klik untuk melihat gambar ukuran penuh)

Setelah mengonfigurasi GridView Anda, pastikan markup deklaratifnya menyerupan berikut:

<asp:GridView ID="UserAccounts" runat="server" AutoGenerateColumns="False">
 <Columns>
 <asp:BoundField DataField="UserName" HeaderText="UserName"/>
 <asp:BoundField DataField="Email" HeaderText="Email" />
 <asp:CheckBoxField DataField="IsApproved" HeaderText="Approved?"/>
 <asp:CheckBoxField DataField="IsLockedOut" HeaderText="Locked Out?" />
 <asp:CheckBoxField DataField="IsOnline" HeaderText="Online?"/>
 <asp:BoundField DataField="Comment" HeaderText="Comment"/>
 </Columns>
</asp:GridView>

Selanjutnya, kita perlu menulis kode yang mengikat akun pengguna ke GridView. Buat metode bernama BindUserAccounts untuk melakukan tugas ini lalu panggil dari penanganan Page_Load aktivitas pada kunjungan halaman pertama.

protected void Page_Load(object sender, EventArgs e)
{
    if (!Page.IsPostBack)
    BindUserAccounts();
}

private void BindUserAccounts()
{
    UserAccounts.DataSource = Membership.GetAllUsers();
    UserAccounts.DataBind();
}

Luangkan waktu sejenak untuk menguji halaman melalui browser. Seperti yang ditunjukkan UserAccounts Gambar 4, GridView mencantumkan nama pengguna, alamat email, dan informasi akun terkait lainnya untuk semua pengguna dalam sistem.

Akun Pengguna Tercantum di GridView

Gambar 4: Akun Pengguna Tercantum di GridView (Klik untuk melihat gambar ukuran penuh)

Langkah 3: Memfilter Hasil berdasarkan Huruf Pertama Nama Pengguna

UserAccounts Saat ini GridView menampilkan semua akun pengguna. Untuk situs web dengan ratusan atau ribuan akun pengguna, sangat penting bahwa pengguna dapat dengan cepat memanjakan akun yang ditampilkan. Ini dapat dicapai dengan menambahkan pemfilteran LinkButtons ke halaman. Mari kita tambahkan 27 LinkButtons ke halaman: satu berjudul Semua bersama dengan satu LinkButton untuk setiap huruf alfabet. Jika pengunjung mengklik Semua LinkButton, GridView akan menampilkan semua pengguna. Jika mereka mengklik huruf tertentu, hanya pengguna yang nama penggunanya dimulai dengan huruf yang dipilih yang akan ditampilkan.

Tugas pertama kami adalah menambahkan 27 kontrol LinkButton. Salah satu opsinya adalah membuat 27 LinkButtons secara deklaratif, satu per satu. Pendekatan yang lebih fleksibel adalah menggunakan kontrol Repeater dengan ItemTemplate yang merender LinkButton lalu mengikat opsi pemfilteran ke Repeater sebagai string array.

Mulailah dengan menambahkan kontrol Repeater ke halaman di atas UserAccounts GridView. Atur properti Repeater ID ke FilteringUI. Konfigurasikan templat Repeater sehingga ItemTemplate merender LinkButton yang properti dannya TextCommandName terikat ke elemen array saat ini. Seperti yang kita lihat dalam tutorial Menetapkan Peran ke Pengguna, ini dapat dicapai menggunakan Container.DataItem sintaks pengikatan data. Gunakan Pengulang SeparatorTemplate untuk menampilkan garis vertikal di antara setiap tautan.

<asp:Repeater ID="FilteringUI" runat="server">
 <ItemTemplate>
 <asp:LinkButton runat="server" ID="lnkFilter"
 Text='<%# Container.DataItem %>'
 CommandName='<%# Container.DataItem %>'></asp:LinkButton>
 </ItemTemplate>
 <SeparatorTemplate>|</SeparatorTemplate>
</asp:Repeater>

Untuk mengisi Repeater ini dengan opsi pemfilteran yang diinginkan, buat metode bernama BindFilteringUI. Pastikan untuk memanggil metode ini dari penanganan Page_Load aktivitas pada pemuatan halaman pertama.

protected void Page_Load(object sender, EventArgs e)
{
    if (!Page.IsPostBack)
    {
        BindUserAccounts();
        BindFilteringUI();
    }
}

private void BindFilteringUI()
{
    string[] filterOptions = { "All", "A", "B", "C","D", "E", "F", "G", "H", "I","J", "K", "L", "M", "N", "O","P", "Q", "R", "S", "T", "U","V", "W", "X", "Y", "Z" };
    FilteringUI.DataSource = filterOptions;
    FilteringUI.DataBind();
}

Metode ini menentukan opsi pemfilteran sebagai elemen dalam string array filterOptions. Untuk setiap elemen dalam array, Repeater akan merender LinkButton dengan Text properti dan CommandName yang ditetapkan ke nilai elemen array.

Gambar 5 memperlihatkan ManageUsers.aspx halaman saat dilihat melalui browser.

LinkButtons Pemfilteran Repeater Lists 27

Gambar 5: Repeater Lists 27 Filtering LinkButtons (Klik untuk melihat gambar ukuran penuh)

Catatan

Nama pengguna dapat dimulai dengan karakter apa pun, termasuk angka dan tanda baca. Untuk melihat akun-akun ini, administrator harus menggunakan opsi Semua LinkButton. Atau, Anda dapat menambahkan LinkButton untuk mengembalikan semua akun pengguna yang dimulai dengan angka. Saya meninggalkan ini sebagai latihan untuk pembaca.

Mengklik salah satu pemfilteran LinkButtons menyebabkan postback dan menaikkan peristiwa Repeater ItemCommand , tetapi tidak ada perubahan dalam kisi karena kami belum menulis kode apa pun untuk memfilter hasilnya. Kelas Membership menyertakan FindUsersByName metode yang mengembalikan akun pengguna yang nama penggunanya cocok dengan pola pencarian tertentu. Kita dapat menggunakan metode ini untuk mengambil hanya akun pengguna yang nama penggunanya dimulai dengan huruf yang ditentukan oleh CommandName linkButton yang difilter yang diklik.

Mulailah dengan memperbarui ManageUser.aspx kelas code-behind halaman sehingga menyertakan properti bernama UsernameToMatch. Properti ini mempertahankan string filter nama pengguna di seluruh postback:

private string UsernameToMatch
{
 get
 {
 object o = ViewState["UsernameToMatch"];
 if (o == null)
 return string.Empty;
 else
 return (string)o;
 }
 set
 {
 ViewState["UsernameToMatch"] = value;
 }
}

Properti UsernameToMatch menyimpan nilainya yang ditetapkan ke ViewState dalam koleksi menggunakan kunci UsernameToMatch. Ketika nilai properti ini dibaca, properti ini memeriksa untuk melihat apakah nilai ada dalam ViewState koleksi; jika tidak, nilai default akan menampilkan nilai default, string kosong. Properti UsernameToMatch menunjukkan pola umum, yaitu mempertahankan nilai untuk melihat status sehingga setiap perubahan pada properti dipertahankan di seluruh postback. Untuk informasi selengkapnya tentang pola ini, baca Memahami Status Tampilan ASP.NET.

Selanjutnya, perbarui BindUserAccounts metode sehingga alih-alih memanggil Membership.GetAllUsers, ia memanggil , meneruskan nilai UsernameToMatch properti yang ditambahkan dengan karakter kartubebas Membership.FindUsersByNameSQL, %.

private void BindUserAccounts()
{
    UserAccounts.DataSource = Membership.FindUsersByName(this.UsernameToMatch + "%");
    UserAccounts.DataBind();
}

Untuk menampilkan hanya pengguna yang nama penggunanya dimulai dengan huruf A, atur UsernameToMatch properti ke A lalu panggil BindUserAccounts. Ini akan menghasilkan panggilan ke Membership.FindUsersByName("A%"), yang akan mengembalikan semua pengguna yang nama penggunanya dimulai dengan A. Demikian juga, untuk mengembalikan semua pengguna, menetapkan string kosong ke UsernameToMatch properti sehingga BindUserAccounts metode akan memanggil Membership.FindUsersByName("%"), sehingga mengembalikan semua akun pengguna.

Buat penanganan aktivitas untuk peristiwa Repeater ItemCommand . Kejadian ini dimunculkan setiap kali salah satu filter LinkButtons diklik; itu diteruskan nilai LinkButton CommandName yang diklik melalui RepeaterCommandEventArgs objek . Kita perlu menetapkan nilai yang sesuai ke UsernameToMatch properti dan kemudian memanggil BindUserAccounts metode . CommandName Jika adalah Semua, tetapkan string kosong ke UsernameToMatch sehingga semua akun pengguna ditampilkan. Jika tidak, tetapkan nilai ke CommandNameUsernameToMatch.

protected void FilteringUI_ItemCommand(object source, RepeaterCommandEventArgs e)
{
    if (e.CommandName == "All")
        this.UsernameToMatch = string.Empty;
    else
        this.UsernameToMatch e.CommandName;
    BindUserAccounts();
}

Dengan kode ini di tempat, uji fungsionalitas pemfilteran. Saat halaman pertama kali dikunjungi, semua akun pengguna ditampilkan (lihat kembali ke Gambar 5). Mengklik A LinkButton menyebabkan postback dan memfilter hasilnya, hanya menampilkan akun pengguna yang dimulai dengan A .

Gunakan LinkButtons Pemfilteran untuk Menampilkan Pengguna yang Nama Penggunanya Dimulai dengan Huruf Tertentu

Gambar 6: Gunakan LinkButtons Pemfilteran untuk Menampilkan Pengguna yang Nama Penggunanya Dimulai dengan Huruf Tertentu (Klik untuk melihat gambar ukuran penuh)

Langkah 4: Memperbarui GridView untuk Menggunakan Halaman

GridView yang diperlihatkan dalam Gambar 5 dan 6 mencantumkan semua rekaman yang dikembalikan dari FindUsersByName metode . Jika ada ratusan atau ribuan akun pengguna, ini dapat menyebabkan kelebihan informasi saat melihat semua akun (seperti halnya saat mengklik Semua LinkButton atau ketika awalnya mengunjungi halaman). Untuk membantu menyajikan akun pengguna dalam gugus yang lebih mudah dikelola, mari kita konfigurasikan GridView untuk menampilkan 10 akun pengguna sekaligus.

Kontrol GridView menawarkan dua jenis halaman:

  • Halaman default - mudah diimplementasikan, tetapi tidak efisien. Singkatnya, dengan halaman default GridView mengharapkan semua rekaman dari sumber datanya. Kemudian hanya menampilkan halaman rekaman yang sesuai.
  • Halaman kustom - memerlukan lebih banyak pekerjaan untuk diimplementasikan, tetapi lebih efisien daripada halaman default karena dengan halaman kustom, sumber data hanya mengembalikan kumpulan rekaman yang tepat untuk ditampilkan.

Perbedaan performa antara halaman default dan kustom bisa sangat substansial saat melakukan paging melalui ribuan rekaman. Karena kami sedang membangun antarmuka ini dengan asumsi bahwa mungkin ada ratusan atau ribuan akun pengguna, mari kita gunakan halaman kustom.

Catatan

Untuk diskusi yang lebih menyeluruh tentang perbedaan antara halaman default dan kustom, serta tantangan yang terlibat dalam menerapkan penomor kustom, lihat Halaman Efisien Melalui Data Dalam Jumlah Besar.

Untuk mengimplementasikan halaman kustom, pertama-tama kita memerlukan beberapa mekanisme untuk mengambil subset rekaman yang tepat yang ditampilkan oleh GridView. Kabar baiknya adalah bahwa Membership metode kelas FindUsersByName memiliki kelebihan beban yang memungkinkan kita menentukan indeks halaman dan ukuran halaman, dan hanya mengembalikan akun pengguna yang termasuk dalam rentang rekaman tersebut.

Secara khusus, kelebihan beban ini memiliki tanda tangan berikut: FindUsersByName(usernameToMatch, pageIndex, pageSize, totalRecords).

Parameter pageIndex menentukan halaman akun pengguna yang akan dikembalikan; pageSize menunjukkan berapa banyak rekaman yang akan ditampilkan per halaman. Parameter totalRecords adalah out parameter yang mengembalikan jumlah total akun pengguna di penyimpanan pengguna.

Catatan

Data yang dikembalikan oleh FindUsersByName diurutkan menurut nama pengguna; kriteria pengurutan tidak dapat dikustomisasi.

GridView dapat dikonfigurasi untuk menggunakan halaman kustom, tetapi hanya ketika terikat ke kontrol ObjectDataSource. Agar kontrol ObjectDataSource menerapkan penomoran kustom, diperlukan dua metode: satu yang melewati indeks baris awal dan jumlah maksimum rekaman untuk ditampilkan, dan mengembalikan subset rekaman yang tepat yang termasuk dalam rentang tersebut; dan metode yang mengembalikan jumlah total rekaman yang di-paged through. Kelebihan FindUsersByName beban menerima indeks halaman dan ukuran halaman, dan mengembalikan jumlah total rekaman melalui out parameter. Jadi ada ketidakcocokan antarmuka di sini.

Salah satu opsinya adalah membuat kelas proksi yang mengekspos antarmuka yang diharapkan ObjectDataSource, lalu memanggil FindUsersByName metode secara internal. Opsi lain - dan yang akan kami gunakan untuk artikel ini - adalah membuat antarmuka halaman kami sendiri dan menggunakannya alih-alih antarmuka penomor bawaan GridView.

Membuat Antarmuka Halaman Pertama, Sebelumnya, Berikutnya, Terakhir

Mari kita buat antarmuka paging dengan First, Previous, Next, dan Last LinkButtons. LinkButton Pertama, ketika diklik, akan membawa pengguna ke halaman pertama data, sedangkan Sebelumnya akan mengembalikannya ke halaman sebelumnya. Demikian juga, Berikutnya dan Terakhir akan memindahkan pengguna ke halaman berikutnya dan terakhir, masing-masing. Tambahkan empat kontrol LinkButton di bawah UserAccounts GridView.

<p>
 <asp:LinkButton ID="lnkFirst" runat="server"> First</asp:LinkButton> |
 <asp:LinkButton ID="lnkPrev" runat="server">  Prev</asp:LinkButton>|
 <asp:LinkButton ID="lnkNext" runat="server">Next  </asp:LinkButton>|
 <asp:LinkButton ID="lnkLast" runat="server">Last  </asp:LinkButton>
</p>

Selanjutnya, buat penanganan aktivitas untuk setiap peristiwa LinkButton Click .

Gambar 7 memperlihatkan empat LinkButtons saat dilihat melalui tampilan Desain Pengembang Web Visual.

Tambahkan LinkButton Pertama, Sebelumnya, Berikutnya, dan Terakhir Di bawah GridView

Gambar 7: Tambahkan LinkButton Pertama, Sebelumnya, Berikutnya, dan Terakhir Di bawah GridView (Klik untuk melihat gambar ukuran penuh)

Melacak Indeks Halaman Saat Ini

Saat pengguna pertama kali mengunjungi ManageUsers.aspx halaman atau mengklik salah satu tombol pemfilteran, kami ingin menampilkan halaman pertama data di GridView. Namun, ketika pengguna mengklik salah satu navigasi LinkButtons, kita perlu memperbarui indeks halaman. Untuk mempertahankan indeks halaman dan jumlah rekaman yang akan ditampilkan per halaman, tambahkan dua properti berikut ke kelas kode di belakang halaman:

private int PageIndex
{
 get
 {
 object o = ViewState["PageIndex"];
 if (o == null)
 return 0;
 else
 return (int)o;
 }
 set
 {
 ViewState["PageIndex"] = value;
 }
}

private int PageSize
{
 get
 {
 return 10;
 }
}

UsernameToMatch Seperti properti , PageIndex properti mempertahankan nilainya untuk melihat status. Properti baca-saja PageSize mengembalikan nilai yang dikodekan secara permanen, 10. Saya mengundang pembaca yang tertarik untuk memperbarui properti ini untuk menggunakan pola yang sama dengan PageIndex, lalu untuk menambah ManageUsers.aspx halaman sehingga orang yang mengunjungi halaman dapat menentukan berapa banyak akun pengguna yang akan ditampilkan per halaman.

Mengambil Hanya Rekaman Halaman Saat Ini, Memperbarui Indeks Halaman, dan Mengaktifkan dan Menonaktifkan LinkButtons Antarmuka Halaman

Dengan antarmuka paging di tempat dan PageIndex properti dan PageSize ditambahkan, kami siap untuk memperbarui BindUserAccounts metode sehingga menggunakan kelebihan beban yang sesuai FindUsersByName . Selain itu, kita harus mengaktifkan metode ini atau menonaktifkan antarmuka halaman tergantung pada halaman apa yang ditampilkan. Saat melihat halaman pertama data, tautan Pertama dan Sebelumnya harus dinonaktifkan; Berikutnya dan Terakhir harus dinonaktifkan saat melihat halaman terakhir.

BindUserAccounts Perbarui metode dengan kode berikut:

private void BindUserAccounts()
{
 int totalRecords;
 UserAccounts.DataSource = Membership.FindUsersByName(this.UsernameToMatch + "%",this.PageIndex, this.PageSize, out totalRecords);
 UserAccounts.DataBind();

 // Enable/disable the paging interface
 bool visitingFirstPage = (this.PageIndex == 0);
 lnkFirst.Enabled = !visitingFirstPage;
 lnkPrev.Enabled = !visitingFirstPage;

 int lastPageIndex = (totalRecords - 1) / this.PageSize;
 bool visitingLastPage = (this.PageIndex >= lastPageIndex);
 lnkNext.Enabled = !visitingLastPage;
 lnkLast.Enabled = !visitingLastPage;
}

Perhatikan bahwa jumlah total rekaman yang di-paged through ditentukan oleh parameter terakhir metode FindUsersByName . Ini adalah out parameter, jadi kita perlu terlebih dahulu mendeklarasikan variabel untuk menahan nilai ini (totalRecords) dan kemudian mengawalinya dengan out kata kunci.

Setelah halaman akun pengguna yang ditentukan dikembalikan, empat LinkButton diaktifkan atau dinonaktifkan, tergantung pada apakah halaman pertama atau terakhir data sedang dilihat.

Langkah terakhir adalah menulis kode untuk empat penanganan aktivitas LinkButtons Click . Penanganan aktivitas ini perlu memperbarui PageIndex properti lalu mengikat ulang data ke GridView melalui panggilan ke BindUserAccounts. Penanganan aktivitas Pertama, Sebelumnya, dan Berikutnya sangat sederhana. Penanganan Click aktivitas untuk Last LinkButton, namun, sedikit lebih kompleks karena kita perlu menentukan berapa banyak rekaman yang ditampilkan untuk menentukan indeks halaman terakhir.

protected void lnkFirst_Click(object sender, EventArgs e)
{
 this.PageIndex = 0;
 BindUserAccounts();
}

protected void lnkPrev_Click(object sender, EventArgs e)
{
 this.PageIndex -= 1;
 BindUserAccounts();
}

protected void lnkNext_Click(object sender, EventArgs e)
{
 this.PageIndex += 1;
 BindUserAccounts();
}

protected void lnkLast_Click(object sender, EventArgs e)
{
 // Determine the total number of records
 int totalRecords;
 Membership.FindUsersByName(this.UsernameToMatch + "%", this.PageIndex,this.PageSize, out totalRecords);
 // Navigate to the last page index
 this.PageIndex = (totalRecords - 1) / this.PageSize;
 BindUserAccounts();
}

Gambar 8 dan 9 menunjukkan antarmuka paging kustom yang sedang beraksi. Gambar 8 memperlihatkan ManageUsers.aspx halaman saat menampilkan halaman pertama data untuk semua akun pengguna. Perhatikan bahwa hanya 10 dari 13 akun yang ditampilkan. Mengklik tautan Berikutnya atau Terakhir menyebabkan postback, memperbarui PageIndex ke 1, dan mengikat halaman kedua akun pengguna ke kisi (lihat Gambar 9).

10 Akun Pengguna Pertama Ditampilkan

Gambar 8: 10 Akun Pengguna Pertama Ditampilkan (Klik untuk melihat gambar ukuran penuh)

Mengklik Tautan Berikutnya Menampilkan Halaman Kedua Akun Pengguna

Gambar 9: Mengklik Tautan Berikutnya Menampilkan Halaman Kedua Akun Pengguna (Klik untuk melihat gambar ukuran penuh)

Ringkasan

Administrator sering kali perlu memilih pengguna dari daftar akun. Dalam tutorial sebelumnya kita melihat menggunakan daftar drop-down yang diisi dengan pengguna, tetapi pendekatan ini tidak menskalakan dengan baik. Dalam tutorial ini kita mengeksplorasi alternatif yang lebih baik: antarmuka yang dapat difilter yang hasilnya ditampilkan di GridView halaman. Dengan antarmuka pengguna ini, administrator dapat dengan cepat dan efisien menemukan dan memilih satu akun pengguna di antara ribuan.

Selamat Pemrograman!

Bacaan lebih lanjut

Untuk informasi selengkapnya tentang topik yang dibahas dalam tutorial ini, lihat sumber daya berikut:

Tentang Penulis

Scott Mitchell, penulis beberapa buku ASP/ASP.NET dan pendiri 4GuysFromRolla.com, telah bekerja dengan teknologi Microsoft Web sejak 1998. Scott bekerja sebagai konsultan, pelatih, dan penulis independen. Buku terbarunya adalah Sams Teach Yourself ASP.NET 2.0 dalam 24 Jam. Scott dapat dijangkau di mitchell@4guysfromrolla.com atau melalui blognya di http://ScottOnWriting.NET.

Terima kasih khusus kepada

Seri tutorial ini ditinjau oleh banyak peninjau yang bermanfaat. Peninjau prospek untuk tutorial ini adalah Alicja Maziarz. Tertarik untuk meninjau artikel MSDN saya yang akan datang? Jika demikian, letakkan saya antrean di mitchell@4GuysFromRolla.com

Berikutnya