Erstellen einer Benutzeroberfläche zum Auswählen eines Benutzerkontos aus vielen (C#)

von Scott Mitchell

In diesem Lernprogramm erstellen wir eine Benutzeroberfläche mit einem seitenseitigen, filterbaren Raster. Insbesondere besteht unsere Benutzeroberfläche aus einer Reihe von LinkButtons zum Filtern der Ergebnisse basierend auf dem Anfangsbuchstaben des Benutzernamens und einem GridView-Steuerelement zum Anzeigen der übereinstimmenden Benutzer. Wir beginnen damit, alle Benutzerkonten in einer GridView aufzulisten. Anschließend fügen wir in Schritt 3 die FilterlinkButtons hinzu. In Schritt 4 werden die gefilterten Ergebnisse paginiert. Die in den Schritten 2 bis 4 erstellte Schnittstelle wird in den nachfolgenden Lernprogrammen verwendet, um administrative Aufgaben für ein bestimmtes Benutzerkonto auszuführen.

Einführung

Im Lernprogramm zum Zuweisen von Rollen zu Benutzern haben wir eine rudimentäre Benutzeroberfläche für einen Administrator erstellt, um einen Benutzer auszuwählen und ihre Rollen zu verwalten. Insbesondere stellte die Schnittstelle dem Administrator eine Dropdownliste aller Benutzer vor. Eine solche Schnittstelle eignet sich, wenn es nur ein Dutzend oder einige Benutzerkonten gibt. Sie wird jedoch unübersichtlich für Websites mit Hunderten oder Tausenden von Benutzerkonten. Ein seitenseitiges, filterbares Raster eignet sich besser für Websites mit großen Benutzerbasen.

In diesem Lernprogramm erstellen wir eine solche Benutzeroberfläche. Insbesondere besteht unsere Benutzeroberfläche aus einer Reihe von LinkButtons zum Filtern der Ergebnisse basierend auf dem Anfangsbuchstaben des Benutzernamens und einem GridView-Steuerelement zum Anzeigen der übereinstimmenden Benutzer. Wir beginnen damit, alle Benutzerkonten in einer GridView aufzulisten. Anschließend fügen wir in Schritt 3 die FilterlinkButtons hinzu. In Schritt 4 werden die gefilterten Ergebnisse paginiert. Die in den Schritten 2 bis 4 erstellte Schnittstelle wird in den nachfolgenden Lernprogrammen verwendet, um administrative Aufgaben für ein bestimmtes Benutzerkonto auszuführen.

Fangen wir an!

Schritt 1: Hinzufügen neuer ASP.NET Seiten

In diesem Tutorial und den nächsten beiden werden wir verschiedene verwaltungsbezogene Funktionen und Fähigkeiten untersuchen. Wir benötigen eine Reihe von ASP.NET Seiten, um die in diesen Lernprogrammen untersuchten Themen zu implementieren. Lassen Sie uns diese Seiten erstellen und die Sitemap aktualisieren.

Erstellen Sie zunächst einen neuen Ordner im Projekt mit dem Namen Administration. Fügen Sie als Nächstes zwei neue ASP.NET-Seiten zum Ordner hinzu, wobei jede Seite mit der Site.master Masterseite verknüpft wird. Benennen Sie die Seiten:

• ManageUsers.aspx
• UserInformation.aspx

Fügen Sie außerdem zwei Seiten zum Stammverzeichnis der Website hinzu: ChangePassword.aspx und RecoverPassword.aspx.

Diese vier Seiten sollten zu diesem Zeitpunkt über zwei Inhaltssteuerelemente verfügen, eines für jeden der ContentPlaceHolders der Masterseite: MainContent und LoginContent.

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

Wir möchten das Standard-Markup der Masterseite für den LoginContent ContentPlaceHolder für diese Seiten anzeigen. Entfernen Sie daher das deklarative Markup für das Content2 Inhaltssteuerelement. Danach sollte das Markup der Seiten nur ein Inhaltssteuerelement enthalten.

Die ASP.NET Seiten im Administration Ordner sind ausschließlich für Administrative Benutzer vorgesehen. Wir haben dem System eine Administratorrolle im Lernprogramm zum Erstellen und Verwalten von Rollen hinzugefügt. Beschränken Sie den Zugriff auf diese beiden Seiten auf diese Rolle. Fügen Sie dazu dem Ordner eine Web.config-Datei hinzu, und konfigurieren Sie dessen <authorization> Element, um Benutzer in der Rolle "Administratoren" zuzulassen und allen anderen den Zugang zu verweigern.

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

An diesem Punkt sollte Ihr Projektmappen-Explorer dem Screenshot in Abbildung 1 ähnlich aussehen.

Abbildung 1: Vier neue Seiten und eine Web.config Datei wurden der Website hinzugefügt (Klicken Sie hier, um das Bild in voller Größe anzuzeigen)

Aktualisieren Sie schließlich die Websitekarte (Web.sitemap), um einen Eintrag für die Seite ManageUsers.aspx hinzuzufügen. Fügen Sie den folgenden XML-Code nach dem von uns hinzugefügten <siteMapNode> für die Tutorials zu Rollen ein.

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

Sobald die Sitemap aktualisiert ist, besuchen Sie die Website über einen Browser. Wie in Abbildung 2 dargestellt, enthält die Navigation auf der linken Seite nun Elemente für die Verwaltungslernprogramme.

Abbildung 2: Die Websiteübersicht enthält einen Knoten mit dem Titel "Benutzerverwaltung" (Klicken Sie, um das Bild in voller Größe anzuzeigen)

Schritt 2: Auflisten aller Benutzerkonten in einer GridView

Unser Ziel für dieses Lernprogramm ist es, ein seitenseitiges, filterbares Raster zu erstellen, über das ein Administrator ein Benutzerkonto für die Verwaltung auswählen kann. Beginnen wir damit, alle Benutzer in einer GridView aufzulisten. Sobald dies abgeschlossen ist, fügen wir die Filter- und Pagingschnittstellen und -funktionen hinzu.

Öffnen Sie die ManageUsers.aspx-Seite im Administration-Ordner und fügen Sie eine GridView hinzu, dessen ID auf UserAccounts gesetzt wird. In einem Moment schreiben wir Code, um die Gruppe von Benutzerkonten mithilfe der Methode der Membership Klasse GetAllUsers an gridView zu binden. Wie in früheren Lernprogrammen erläutert, gibt die GetAllUsers-Methode ein MembershipUserCollection Objekt zurück, bei dem es sich um eine Auflistung von MembershipUser Objekten handelt. Jede MembershipUser in der Auflistung enthält Eigenschaften wie UserName, Email, , IsApprovedusw.

Um die gewünschten Benutzerkontoinformationen in der GridView anzuzeigen, setzen Sie die Eigenschaft AutoGenerateColumns der GridView auf "False" und fügen Sie BoundFields für die Eigenschaften UserName, Email und Comment sowie CheckBoxFields für die Eigenschaften IsApproved, IsLockedOut und IsOnline hinzu. Diese Konfiguration kann über das deklarative Markup des Steuerelements oder über das Dialogfeld "Felder" angewendet werden. Abbildung 3 zeigt einen Screenshot des Dialogfelds "Felder", nachdem das Kontrollkästchen "Felder automatisch generieren" deaktiviert wurde und die "BoundFields" und "CheckBoxFields" hinzugefügt und konfiguriert wurden.

Abbildung 3: Hinzufügen von "Three BoundFields" und "Three CheckBoxFields" zur GridView (Klicken Sie hier, um das Bild in voller Größe anzuzeigen)

Stellen Sie nach dem Konfigurieren ihrer GridView sicher, dass ihr deklaratives Markup wie folgt aussieht:

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

Als Nächstes müssen wir Code schreiben, der die Benutzerkonten an gridView bindet. Erstellen Sie eine Methode, die benannt ist BindUserAccounts , um diese Aufgabe auszuführen, und rufen Sie sie dann vom Page_Load Ereignishandler auf der ersten Seite auf.

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

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

Nehmen Sie sich einen Moment Zeit, um die Seite über einen Browser zu testen. Wie in Abbildung 4 dargestellt, listet GridView UserAccounts den Benutzernamen, die E-Mail-Adresse und andere relevante Kontoinformationen für alle Benutzer im System auf.

Abbildung 4: Die Benutzerkonten werden in der GridView aufgelistet (Klicken Sie hier, um das Bild mit voller Größe anzuzeigen)

Schritt 3: Filtern der Ergebnisse nach dem ersten Buchstaben des Benutzernamens

Derzeit zeigt die UserAccounts GridView alle Benutzerkonten an. Für Websites mit Hunderten oder Tausenden von Benutzerkonten ist es zwingend erforderlich, dass Benutzer die angezeigten Konten schnell eingrenzen können. Dies kann durch das Hinzufügen von Filter-LinkButtons zur Seite erreicht werden. Fügen wir der Seite 27 LinkButtons hinzu: ein LinkButton-Element mit dem Titel "Alle" zusammen mit einem LinkButton-Element für jeden Buchstaben des Alphabets. Wenn ein Besucher auf das All LinkButton klickt, zeigt die GridView alle Benutzer an. Wenn sie auf einen bestimmten Buchstaben klicken, werden nur die Benutzer angezeigt, deren Benutzername mit dem ausgewählten Buchstaben beginnt.

Unsere erste Aufgabe besteht darin, die 27 LinkButton-Steuerelemente hinzuzufügen. Eine Möglichkeit wäre, die 27 LinkButtons deklarativ zu erstellen, jeweils einzeln. Ein flexiblerer Ansatz besteht darin, ein Repeater-Steuerelement mit einem ItemTemplate Steuerelement zu verwenden, das ein LinkButton rendert und dann die Filteroptionen als string Array an den Repeater bindet.

Fügen Sie zunächst ein Repeater-Steuerelement zur Seite oberhalb der UserAccounts GridView hinzu. Legen Sie die Eigenschaft des ID Repeaters auf FilteringUI. Konfigurieren Sie die Vorlagen des Repeaters so, dass sie ItemTemplate ein LinkButton-Element rendert, dessen Text Eigenschaften an CommandName das aktuelle Arrayelement gebunden sind. Wie wir im Lernprogramm zum Zuweisen von Rollen zu Benutzern gesehen haben, kann dies mithilfe der Container.DataItem Datenbindungssyntax erreicht werden. Verwenden Sie den Repeater SeparatorTemplate, um eine vertikale Linie zwischen den einzelnen Links anzuzeigen.

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

Um diesen Repeater mit den gewünschten Filteroptionen aufzufüllen, erstellen Sie eine Methode mit dem Namen BindFilteringUI. Achten Sie darauf, diese Methode aus dem Page_Load Ereignishandler beim laden der ersten Seite aufzurufen.

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();
}

Diese Methode gibt die Filteroptionen als Elemente im string Array filterOptionsan. Für jedes Element im Array rendert der Repeater ein LinkButton mit seinen Text und CommandName Eigenschaften, die dem Wert des Arrayelements zugewiesen sind.

Abbildung 5 zeigt die ManageUsers.aspx Seite, wenn sie in einem Browser angezeigt wird.

Abbildung 5: Der Repeater listet 27 Filterschaltflächen auf (Klicken Sie hier, um das Bild in voller Größe anzuzeigen)

Wenn Sie auf einen der FilterlinkButtons klicken, wird ein Postback ausgelöst und das Ereignis des ItemCommand Repeaters wird aufgerufen, aber im Gitter gibt es keine Änderung, da wir noch keinen Code geschrieben haben, um die Ergebnisse zu filtern. Die Membership Klasse enthält eine FindUsersByName Methode , die diese Benutzerkonten zurückgibt, deren Benutzername mit einem angegebenen Suchmuster übereinstimmt. Wir können diese Methode verwenden, um nur die Benutzerkonten abzurufen, deren Benutzernamen mit dem buchstaben beginnen, der durch das CommandName gefilterte LinkButton-Element angegeben wurde, auf das geklickt wurde.

Aktualisieren Sie zunächst die CodeBehind-Klasse der ManageUser.aspx Seite so, dass sie eine Eigenschaft mit dem Namen UsernameToMatchenthält. Diese Eigenschaft behält die Benutzernamenfilterzeichenfolge für Postbacks bei:

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

Die UsernameToMatch Eigenschaft speichert den ihr zugewiesenen Wert in der ViewState Auflistung unter Verwendung des Schlüssels UsernameToMatch. Wenn der Wert dieser Eigenschaft gelesen wird, wird überprüft, ob ein Wert in der ViewState Auflistung vorhanden ist. Andernfalls gibt sie den Standardwert einer leeren Zeichenfolge zurück. Die UsernameToMatch Eigenschaft weist ein gängiges Muster auf, nämlich das Speichern eines Werts im ViewState, sodass alle Änderungen an der Eigenschaft bei Postbacks erhalten bleiben. Weitere Informationen zu diesem Muster finden Sie unter "Understanding ASP.NET View State".

Aktualisieren Sie als Nächstes die BindUserAccounts-Methode, sodass sie anstelle des Aufrufs von Membership.GetAllUsers nun Membership.FindUsersByName aufruft und den Wert der UsernameToMatch-Eigenschaft übergibt, der mit dem SQL-Wildcardzeichen '%' angefügt ist.

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

Wenn Sie nur die Benutzer anzeigen möchten, deren Benutzername mit dem Buchstaben A beginnt, legen Sie die UsernameToMatch Eigenschaft auf A fest, und rufen Sie dann auf BindUserAccounts. Dies würde zu einem Aufruf von Membership.FindUsersByName("A%") führen, der alle Benutzer zurückgibt, deren Benutzername mit A beginnt. Ähnlich weist man der Eigenschaft UsernameToMatch eine leere Zeichenfolge zu, sodass die Methode BindUserAccountsMembership.FindUsersByName("%") aufruft, wodurch alle Benutzerkonten zurückgegeben werden.

Erstellen Sie einen Ereignishandler für das ItemCommand-Ereignis des Repeaters. Dieses Ereignis wird ausgelöst, wenn auf eines der FilterlinkButtons geklickt wird. der Wert des geklickten LinkButton-Elements CommandName wird über das RepeaterCommandEventArgs Objekt übergeben. Wir müssen der UsernameToMatch Eigenschaft den entsprechenden Wert zuweisen und dann die BindUserAccounts Methode aufrufen. Wenn " CommandName Alle" ist, weisen Sie eine leere Zeichenfolge zu UsernameToMatch , damit alle Benutzerkonten angezeigt werden. Weisen Sie den Wert von CommandName andernfalls UsernameToMatch zu.

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

Testen Sie mit diesem Code die Filterfunktion. Wenn die Seite zum ersten Mal besucht wird, werden alle Benutzerkonten angezeigt (siehe Abbildung 5). Beim Klicken auf den Link-Button "A" erfolgt ein Postback und die Ergebnisse werden gefiltert, sodass nur die Benutzerkonten angezeigt werden, die mit "A" beginnen.

Abbildung 6: Verwenden der Filterverknüpfungsschaltflächen zum Anzeigen der Benutzer, deren Benutzername mit einem bestimmten Buchstaben beginnt (Klicken Sie, um das Bild in voller Größe anzuzeigen)

Schritt 4: Aktualisieren der GridView für die Verwendung von Paging

Die in Abbildung 5 und 6 dargestellte GridView listet alle Datensätze auf, die von der FindUsersByName Methode zurückgegeben werden. Wenn es Hunderte oder Tausende von Benutzerkonten gibt, kann dies zu Informationsüberlastung führen, wenn alle Konten angezeigt werden (wie es beim Klicken auf das All LinkButton-Element oder beim ersten Besuch der Seite der Fall ist). Um die Benutzerkonten in besser verwaltbaren Blöcken darzustellen, konfigurieren wir die GridView so, dass jeweils 10 Benutzerkonten angezeigt werden.

Das GridView-Steuerelement bietet zwei Arten von Paging:

• Standard paging - einfach zu implementieren, aber ineffizient. Kurz gesagt, mit standardmäßiges Paging erwartet GridView alle Datensätze aus der Datenquelle. Anschließend wird nur die entsprechende Seite mit Datensätzen angezeigt.
• Benutzerdefiniertes Paging – erfordert mehr Arbeit zum Implementieren, ist aber effizienter als die Standard paging, da bei benutzerdefiniertem Paging die Datenquelle nur den genauen Datensatz zurückgibt, der angezeigt werden soll.

Der Leistungsunterschied zwischen Standard- und benutzerdefiniertem Paging kann beim Durchblättern durch Tausende von Datensätzen sehr erheblich sein. Da wir diese Schnittstelle erstellen und davon ausgehen, dass es Hunderte oder Tausende von Benutzerkonten gibt, verwenden wir benutzerdefiniertes Paging.

Um benutzerdefinierte Paging zu implementieren, benötigen wir zunächst einen Mechanismus, mit dem die genaue Teilmenge der Datensätze abgerufen werden kann, die von GridView angezeigt werden. Die gute Nachricht ist, dass die Methode FindUsersByName der Klasse Membership eine Überladung besitzt, die es uns erlaubt, den Seitenindex und die Seitengröße anzugeben, und nur die Benutzerkonten zurückgibt, die in diesen Datensatzbereich fallen.

Insbesondere hat diese Überladung die folgende Signatur: FindUsersByName(usernameToMatch, pageIndex, pageSize, totalRecords).

Der parameter pageIndex gibt die Seite der zurückzugebenden Benutzerkonten an; pageSize gibt an, wie viele Datensätze pro Seite angezeigt werden sollen. Der Parameter totalRecords ist ein out Parameter, der die Anzahl der Gesamtzahl der Benutzerkonten im Benutzerspeicher zurückgibt.

Die GridView kann so konfiguriert werden, dass benutzerdefinierte Seitenverwaltung verwendet wird, aber nur, wenn sie an ein ObjectDataSource-Steuerelement gebunden ist. Für das ObjectDataSource-Steuerelement zum Implementieren benutzerdefinierter Paginierung sind zwei Methoden erforderlich: eine, der ein Startzeilenindex und die maximale Anzahl anzuzeigender Datensätze übergeben werden, die die genaue Teilmenge von Datensätzen zurückgibt, die innerhalb dieses Bereichs liegen; und eine Methode, die die Gesamtanzahl der Datensätze zurückgibt, durch die geblättert wird. Die FindUsersByName Überladung akzeptiert einen Seitenindex und eine Seitengröße und gibt die Gesamtanzahl der Datensätze über einen out Parameter zurück. Es gibt also hier ein Schnittstellenkonflikt.

Eine Option wäre das Erstellen einer Proxyklasse, die die Schnittstelle verfügbar macht, die objectDataSource erwartet, und dann intern die FindUsersByName Methode aufruft. Eine weitere Option , die wir für diesen Artikel verwenden werden, besteht darin, unsere eigene Paging-Schnittstelle zu erstellen und diese anstelle der integrierten Paging-Schnittstelle von GridView zu verwenden.

Erstellen einer ersten, vorherigen, nächsten, letzten Paging-Schnittstelle

Lassen Sie uns eine Pagingschnittstelle mit den Link-Buttons: Erster, Vorheriger, Nächster und Letzter erstellen. Der erste LinkButton, wenn er angeklickt wird, bringt den Benutzer zur ersten Datenseite, während „Zurück“ ihn zur vorherigen Seite bringt. Ebenso werden "Weiter" und "Letzte" den Benutzer zur nächsten bzw. letzten Seite bewegen. Fügen Sie die vier LinkButton-Steuerelemente unter der UserAccounts GridView hinzu.

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

Erstellen Sie als Nächstes einen Ereignishandler für jedes der Ereignisse von LinkButton Click .

Abbildung 7 zeigt die vier LinkButtons, wenn sie in der Entwurfsansicht von Visual Web Developer angezeigt werden.

Abbildung 7: Erste, Vorherige, Nächste und Letzte Link-Schaltflächen unter dem GridView hinzufügen (Click to view full-size image)

Nachverfolgen des aktuellen Seitenindexes

Wenn ein Benutzer die ManageUsers.aspx Seite zum ersten Mal besucht oder auf eine der Filterschaltflächen klickt, möchten wir die erste Seite mit Daten in gridView anzeigen. Wenn der Benutzer jedoch auf eines der NavigationslinkButtons klickt, müssen wir den Seitenindex aktualisieren. Um den Seitenindex und die Anzahl der pro Seite anzuzeigenden Datensätze beizubehalten, fügen Sie die folgenden beiden Eigenschaften zur CodeBehind-Klasse der Seite hinzu:

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

Wie die UsernameToMatch-Eigenschaft behält die PageIndex-Eigenschaft ihren Wert im View-State bei. Die schreibgeschützte PageSize-Eigenschaft gibt einen hartcodierten Wert, 10, zurück. Ich lade den interessierten Leser ein, diese Eigenschaft zu aktualisieren, um dasselbe Muster wie PageIndexzu verwenden, und dann die Seite so zu erweitern ManageUsers.aspx , dass die Person, die die Seite besucht, angeben kann, wie viele Benutzerkonten pro Seite angezeigt werden sollen.

Nur die Datensätze der aktuellen Seite abrufen, den Seitenindex aktualisieren sowie die Schaltflächen der Paging-Schnittstelle aktivieren und deaktivieren.

Nachdem die Paging-Schnittstelle vorhanden ist und die PageSize Eigenschaften hinzugefügt wurden, sind wir bereit, die BindUserAccounts Methode so zu aktualisieren, dass sie die entsprechende FindUsersByName Überladung verwendet. Darüber hinaus müssen wir diese Methode so gestalten, dass sie die Paging-Schnittstelle entsprechend der angezeigten Seite aktiviert oder deaktiviert. Beim Anzeigen der ersten Seite mit Daten sollten die Verknüpfungen "Erster" und "Vorheriger" deaktiviert werden. Beim Anzeigen der letzten Seite sollte "Next" und "Last" deaktiviert werden.

Aktualisieren Sie die BindUserAccounts-Methode mit folgendem Code:

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

Beachten Sie, dass die Gesamtanzahl der Datensätze, die durchlaufen werden, durch den letzten Parameter der FindUsersByName Methode bestimmt wird. Dies ist ein out Parameter, daher müssen wir zuerst eine Variable deklarieren, um diesen Wert (totalRecords) zu speichern und es dann dem out Schlüsselwort voranstellen.

Nachdem die angegebene Seite von Benutzerkonten zurückgegeben wurde, sind die vier LinkButtons entweder aktiviert oder deaktiviert, je nachdem, ob die erste oder letzte Seite der Daten angezeigt wird.

Der letzte Schritt besteht darin, den Code für die vier LinkButtons-Ereignishandler Click zu schreiben. Diese Ereignishandler müssen die PageIndex-Eigenschaft aktualisieren und dann die Daten über einen Aufruf von BindUserAccounts erneut an GridView binden. Die Ereignishandler "First", "Previous" und "Next" sind sehr einfach. Der Click Ereignishandler für das Last LinkButton ist jedoch etwas komplexer, da wir bestimmen müssen, wie viele Datensätze angezeigt werden, um den letzten Seitenindex zu bestimmen.

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();
}

Abbildung 8 und 9 zeigen die benutzerdefinierte Pagingschnittstelle in Aktion. Abbildung 8 zeigt die ManageUsers.aspx Seite beim Anzeigen der ersten Datenseite für alle Benutzerkonten. Beachten Sie, dass nur 10 der 13 Konten angezeigt werden. Wenn Sie auf den Link "Weiter" oder "Zuletzt" klicken, setzt das PageIndex auf 1 und die zweite Seite der Benutzerkonten wird an das Gitter gebunden (siehe Abbildung 9).

Abbildung 8: Die ersten 10 Benutzerkonten werden angezeigt (Zum Anzeigen des Bilds mit voller Größe klicken)

Abbildung 9: Durch Klicken auf den nächsten Link wird die zweite Seite von Benutzerkonten angezeigt (Zum Anzeigen des Bilds mit voller Größe klicken)

Zusammenfassung

Administratoren müssen häufig einen Benutzer aus der Liste der Konten auswählen. In früheren Lernprogrammen haben wir uns mit der Verwendung einer Dropdownliste befasst, die mit den Benutzern gefüllt ist, aber dieser Ansatz ist nicht gut skaliert. In diesem Lernprogramm haben wir eine bessere Alternative untersucht: eine filterbare Schnittstelle, deren Ergebnisse in einer paged GridView angezeigt werden. Mit dieser Benutzeroberfläche können Administratoren schnell und effizient ein Benutzerkonto unter Tausenden suchen und auswählen.

Glückliche Programmierung!

Weiterführende Lektüre

Weitere Informationen zu den in diesem Lernprogramm erläuterten Themen finden Sie in den folgenden Ressourcen:

• Benutzerdefiniertes Paging in ASP.NET mit SQL Server 2005
• Effizientes Blättern durch große Datenmengen

Informationen zum Autor

Scott Mitchell, Autor mehrerer ASP/ASP.NET Bücher und Gründer von 4GuysFromRolla.com, arbeitet seit 1998 mit Microsoft Web Technologies zusammen. Scott arbeitet als unabhängiger Berater, Trainer und Schriftsteller. Sein neuestes Buch ist Sams Teach Yourself ASP.NET 2.0 in 24 Stunden. Scott kann über mitchell@4guysfromrolla.com oder über seinen Blog bei http://ScottOnWriting.NETerreicht werden.

Besonderer Dank an

Diese Tutorialreihe wurde von vielen hilfreichen Rezensenten überprüft. Lead Reviewer für dieses Tutorial war Alicja Maziarz. Möchten Sie meine bevorstehenden MSDN-Artikel überprüfen? Wenn das der Fall ist, schreiben Sie mir eine Nachricht an mitchell@4GuysFromRolla.com