Řazení, stránkování a filtrování dat pomocí vazby modelu a webových formulářů

Článek
07/13/2023

Tato série kurzů ukazuje základní aspekty použití vazby modelu s projektem ASP.NET Web Forms. Díky vazbě modelu je interakce dat jednodušší než práce s objekty zdroje dat (například ObjectDataSource nebo SqlDataSource). Tato série začíná úvodními materiály a v dalších kurzech se přesouvá k pokročilejším konceptům.

Tento kurz ukazuje, jak přidat řazení, stránkování a filtrování dat prostřednictvím vazby modelu.

Tento kurz vychází z projektu vytvořeného v první části série.

Celý projekt si můžete stáhnout v C# nebo VB. Kód ke stažení funguje se sadou Visual Studio 2012 nebo Visual Studio 2013. Používá šablonu sady Visual Studio 2012, která se mírně liší od šablony Visual Studio 2013 uvedené v tomto kurzu.

Co vytvoříte

V tomto kurzu:

Povolení řazení a stránkování dat
Povolení filtrování dat na základě výběru uživatelem

Přidat řazení

Povolení řazení v GridView je velmi snadné. V souboru Student.aspx jednoduše nastavte AllowSorting na hodnotu true v objektu GridView. Není nutné nastavit hodnotu SortExpression pro každý sloupec, protože DataField je automaticky použita. Objekt GridView upraví dotaz tak, aby zahrnoval řazení dat podle vybrané hodnoty. Následující zvýrazněný kód ukazuje přidání, které je potřeba provést, aby bylo možné řazení povolit.

<asp:GridView runat="server" ID="studentsGrid"
    ItemType="ContosoUniversity.Models.Student" DataKeyNames="StudentID"
    SelectMethod="studentsGrid_GetData"
    UpdateMethod="studentsGrid_UpdateItem" DeleteMethod="studentsGrid_DeleteItem"
    AllowSorting="true" 
    AutoGenerateEditButton="true" AutoGenerateDeleteButton="true"  
    AutoGenerateColumns="false">
  <Columns>
    <asp:DynamicField DataField="StudentID" />
    <asp:DynamicField DataField="LastName" />
    <asp:DynamicField DataField="FirstName" />
    <asp:DynamicField DataField="Year" />
    <asp:TemplateField HeaderText="Total Credits">
      <ItemTemplate>
        <asp:Label Text="<%# Item.Enrollments.Sum(en => en.Course.Credits) %>"
            runat="server" />
      </ItemTemplate>
    </asp:TemplateField>        
  </Columns>
</asp:GridView>

Spusťte webovou aplikaci a otestujte řazení záznamů studentů podle hodnot v různých sloupcích.

řazení studentů

Přidání stránkování

Povolení stránkování je také velmi snadné. V objektu GridView nastavte vlastnost AllowPaging na hodnotu true a vlastnost PageSize nastavte na počet záznamů, které chcete zobrazit na každé stránce. V tomto kurzu ji můžete nastavit na hodnotu 4.

<asp:GridView runat="server" ID="studentsGrid"
    ItemType="ContosoUniversity.Models.Student" DataKeyNames="StudentID"
    SelectMethod="studentsGrid_GetData"
    UpdateMethod="studentsGrid_UpdateItem" DeleteMethod="studentsGrid_DeleteItem"
    AllowSorting="true" AllowPaging="true" PageSize="4"
    AutoGenerateEditButton="true" AutoGenerateDeleteButton="true"  
    AutoGenerateColumns="false">

Spusťte webovou aplikaci a všimněte si, že teď jsou záznamy rozdělené na několik stránek s maximálně 4 záznamy zobrazenými na jedné stránce.

přidání stránkování

Odložené provádění dotazů zlepšuje efektivitu aplikace. Místo načtení celé datové sady GridView upraví dotaz tak, aby načítal pouze záznamy pro aktuální stránku.

Filtrování záznamů podle výběru uživatele

Vazba modelu přidává několik atributů, které umožňují určit, jak nastavit hodnotu parametru v metodě vazby modelu. Tyto atributy jsou v oboru názvů System.Web.ModelBinding . Mezi ně patří:

Řízení
Soubor cookie
Formulář
Profil
QueryString
Routedata
Relace
UserProfile
Viewstate

V tomto kurzu použijete hodnotu ovládacího prvku k filtrování záznamů zobrazených v objektu GridView. Do metody dotazu, kterou jste vytvořili dříve, přidáte atribut Control . V pozdějším kurzu použijete atribut QueryString na parametr a určíte, že hodnota parametru pochází z hodnoty řetězce dotazu.

Nejprve nad pole ValidationSummary přidejte rozevírací seznam pro filtrování zobrazených studentů.

<asp:HyperLink runat="server" NavigateUrl="~/AddStudent" Text="Add New Student" />

<br /><br />
<asp:Label runat="server" Text="Show:" />
<asp:DropDownList runat="server" AutoPostBack="true" ID="DisplayYear">
    <asp:ListItem Text="All" Value="" />
    <asp:ListItem Text="Freshman" />
    <asp:ListItem Text="Sophomore" />
    <asp:ListItem Text="Junior" />
    <asp:ListItem Text="Senior" />
</asp:DropDownList>

<asp:ValidationSummary runat="server" ShowModelStateErrors="true"/>

V souboru kódu na pozadí upravte metodu select tak, aby získala hodnotu z ovládacího prvku, a nastavte název parametru na název ovládacího prvku, který hodnotu poskytuje.

Pokud chcete vyřešit atribut Control, musíte přidat příkaz using pro obor názvů System.Web.ModelBinding .

using System.Web.ModelBinding;

Následující kód ukazuje, že metoda select přepracovala na filtrování vrácených dat na základě hodnoty rozevíracího seznamu. Přidání atributu ovládacího prvku před parametr určuje, že hodnota tohoto parametru pochází z ovládacího prvku se stejným názvem.

public IQueryable<Student> studentsGrid_GetData([Control] AcademicYear? displayYear)
{
    SchoolContext db = new SchoolContext();
    var query = db.Students.Include(s => s.Enrollments.Select(e => e.Course));

    if (displayYear != null)
    {
        query = query.Where(s => s.Year == displayYear);   
    }

    return query;    
}

Spusťte webovou aplikaci a výběrem různých hodnot z rozevíracího seznamu vyfiltrujte seznam studentů.

filtrování studentů

Závěr

V tomto kurzu jste povolili řazení a stránkování dat. Povolili jste také filtrování dat podle hodnoty ovládacího prvku.

V dalším kurzu uživatelské rozhraní vylepšíte integrací widgetu uživatelského rozhraní JQuery do šablony dynamických dat.

Předchozí Další

Sdílet prostřednictvím