Stronicowanie i sortowanie danych raportu (C#)

Autor : Scott Mitchell

Pobierz plik PDF

Stronicowanie i sortowanie to dwie bardzo typowe funkcje podczas wyświetlania danych w aplikacji online. W tym samouczku najpierw przyjrzymy się dodawaniu sortowania i stronicowania do raportów, które następnie będziemy konstruować w przyszłych samouczkach.

Wprowadzenie

Stronicowanie i sortowanie to dwie bardzo typowe funkcje podczas wyświetlania danych w aplikacji online. Na przykład podczas wyszukiwania ASP.NET książek w księgarni online mogą istnieć setki takich książek, ale raport zawierający listę wyników wyszukiwania zawiera tylko dziesięć dopasowań na stronę. Ponadto wyniki można sortować według tytułu, ceny, liczby stron, nazwy autora itd. W poprzednich 23 samouczkach przeanalizowano sposób tworzenia różnych raportów, w tym interfejsów, które zezwalają na dodawanie, edytowanie i usuwanie danych, nie przyjrzeliśmy się sposobom sortowania danych i jedynymi przykładami stronicowania, które widzieliśmy w kontrolkach DetailsView i FormView.

W tym samouczku zobaczymy, jak dodać sortowanie i stronicowanie do raportów, co można wykonać, po prostu zaznaczając kilka pól wyboru. Niestety, ta uproszczona implementacja ma swoje wady interfejs sortowania pozostawia nieco do życzenia, a procedury stronicowania nie są przeznaczone do wydajnego stronicowania za pośrednictwem dużych zestawów wyników. W przyszłych samouczkach dowiesz się, jak przezwyciężyć ograniczenia gotowego rozwiązania do stronicowania i sortowania.

Krok 1. Dodawanie stron sieci Web samouczka stronicowania i sortowania

Przed rozpoczęciem tego samouczka najpierw poświęćmy chwilę na dodanie stron ASP.NET potrzebnych w tym samouczku i następnych trzech. Rozpocznij od utworzenia nowego folderu w projekcie o nazwie PagingAndSorting. Następnie dodaj do tego folderu pięć ASP.NET stron, po skonfigurowaniu ich do używania strony Site.masterwzorcowej:

  • Default.aspx
  • SimplePagingSorting.aspx
  • EfficientPaging.aspx
  • SortParameter.aspx
  • CustomSortingUI.aspx

Tworzenie folderu stronicowaniaAndSorting i dodawanie stron ASP.NET samouczka

Rysunek 1. Tworzenie folderu PagingAndSorting i dodawanie strony ASP.NET samouczka

Następnie otwórz Default.aspx stronę i przeciągnij kontrolkę SectionLevelTutorialListing.ascx użytkownika z UserControls folderu na powierzchnię Projekt. Ta kontrolka użytkownika utworzona w samouczku Dotyczącym stron wzorcowych i nawigacji witryny wylicza mapę witryny i wyświetla te samouczki w bieżącej sekcji na liście punktowanej.

Dodaj kontrolkę Użytkownika SectionLevelTutorialListing.ascx, aby Default.aspx

Rysunek 2. Dodawanie kontrolki użytkownika SectionLevelTutorialListing.ascx w celu Default.aspx

Aby lista punktowana wyświetlała samouczki dotyczące stronicowania i sortowania, które utworzymy, musimy dodać je do mapy witryny. Web.sitemap Otwórz plik i dodaj następujący znacznik po adiustacji w węźle Edytowanie, Wstawianie i Usuwanie mapy witryny:

<siteMapNode title="Paging and Sorting" url="~/PagingAndSorting/Default.aspx"
    description="Samples of Reports that Provide Paging and Sorting Capabilities">
    <siteMapNode url="~/PagingAndSorting/SimplePagingSorting.aspx"
        title="Simple Paging & Sorting Examples"
        description="Examines how to add simple paging and sorting support." />
    <siteMapNode url="~/PagingAndSorting/EfficientPaging.aspx"
        title="Efficiently Paging Through Large Result Sets"
        description="Learn how to efficiently page through large result sets." />
    <siteMapNode url="~/PagingAndSorting/SortParameter.aspx"
        title="Sorting Data at the BLL or DAL"
        description="Illustrates how to perform sorting logic in the Business Logic
        Layer or Data Access Layer." />
    <siteMapNode url="~/PagingAndSorting/CustomSortingUI.aspx"
        title="Customizing the Sorting User Interface"
        description="Learn how to customize and improve the sorting user interface." />
</siteMapNode>

Aktualizowanie mapy witryny w celu uwzględnienia nowych stron ASP.NET

Rysunek 3. Aktualizowanie mapy witryny w celu uwzględnienia nowych stron ASP.NET

Krok 2. Wyświetlanie informacji o produkcie w siatceView

Zanim faktycznie zaimplementujemy możliwości stronicowania i sortowania, najpierw utwórzmy standardowy, niestronicowy element GridView, który wyświetla informacje o produkcie. Jest to zadanie, które wykonaliśmy wiele razy wcześniej w tej serii samouczków, więc te kroki powinny być znane. Zacznij od otwarcia SimplePagingSorting.aspx strony i przeciągnięcia kontrolki GridView z przybornika do Projektant, ustawiając jej ID właściwość na Products. Następnie utwórz nową klasę ObjectDataSource, która zwraca wszystkie informacje o produkcie przy użyciu metody klasy GetProducts() ProductsBLL.

Pobieranie informacji o wszystkich produktach przy użyciu metody GetProducts()

Rysunek 4. Pobieranie informacji o wszystkich produktach przy użyciu metody GetProducts()

Ponieważ ten raport jest raportem tylko do odczytu, nie ma potrzeby mapowania metod ObjectDataSource s Insert(), Update()lub Delete() na odpowiednie ProductsBLL metody. W związku z tym wybierz pozycję (Brak) z listy rozwijanej kart UPDATE, INSERT i DELETE.

Wybierz opcję (Brak) na liście Drop-Down na kartach UPDATE, INSERT i DELETE

Rysunek 5. Wybieranie opcji (Brak) na liście Drop-Down na kartach UPDATE, INSERT i DELETE

Następnie dostosujmy pola kontrolki GridView, aby wyświetlane są tylko nazwy produktów, dostawców, kategorii, cen i stanów zakończonych. Ponadto możesz wprowadzić zmiany formatowania na poziomie pola, takie jak dostosowanie HeaderText właściwości lub formatowanie ceny jako waluty. Po tych zmianach znaczniki deklaratywne w kodzie GridView powinny wyglądać podobnie do następujących:

<asp:GridView ID="Products" runat="server" AutoGenerateColumns="False"
    DataKeyNames="ProductID" DataSourceID="ObjectDataSource1"
    EnableViewState="False">
    <Columns>
        <asp:BoundField DataField="ProductName" HeaderText="Product"
            SortExpression="ProductName" />
        <asp:BoundField DataField="CategoryName" HeaderText="Category"
            ReadOnly="True" SortExpression="CategoryName" />
        <asp:BoundField DataField="SupplierName" HeaderText="Supplier"
            ReadOnly="True" SortExpression="SupplierName" />
        <asp:BoundField DataField="UnitPrice" HeaderText="Price"
            SortExpression="UnitPrice" DataFormatString="{0:C}"
            HtmlEncode="False" />
        <asp:CheckBoxField DataField="Discontinued" HeaderText="Discontinued"
            SortExpression="Discontinued" />
    </Columns>
</asp:GridView>

Rysunek 6 przedstawia postęp do tej pory po wyświetleniu w przeglądarce. Zwróć uwagę, że strona zawiera listę wszystkich produktów na jednym ekranie, pokazując nazwę, kategorię, dostawcę, cenę i stan przerwania.

Każdy z produktów znajduje się na liście

Rysunek 6. Każdy z produktów jest wyświetlany (kliknij, aby wyświetlić obraz pełnowymiarowy)

Krok 3. Dodawanie obsługi stronicowania

Wyświetlenie listy wszystkich produktów na jednym ekranie może prowadzić do przeciążenia informacji dla użytkownika przeglądającego dane. Aby ułatwić zarządzanie wynikami, możemy podzielić dane na mniejsze strony danych i umożliwić użytkownikowi przechodzenie przez dane po jednej stronie naraz. Aby to zrobić, wystarczy zaznaczyć pole wyboru Włącz stronicowanie z tagu inteligentnego GridView (powoduje to ustawienie właściwości GridView AllowPaging na truewartość ).

Zaznacz pole wyboru Włącz stronicowanie, aby dodać obsługę stronicowania

Rysunek 7. Zaznacz pole wyboru Włącz stronicowanie, aby dodać obsługę stronicowania (kliknij, aby wyświetlić obraz w pełnym rozmiarze)

Włączenie stronicowania ogranicza liczbę rekordów wyświetlanych na stronie i dodaje interfejs stronicowania do kontrolki GridView. Domyślny interfejs stronicowania, pokazany na rysunku 7, to seria numerów stron, umożliwiająca użytkownikowi szybkie przechodzenie z jednej strony danych do innej. Ten interfejs stronicowania powinien wyglądać znajomo, jak widzieliśmy podczas dodawania obsługi stronicowania do kontrolek DetailsView i FormView w poprzednich samouczkach.

Kontrolki DetailsView i FormView pokazują tylko jeden rekord na stronę. Obiekt GridView sprawdza jednak jego PageSize właściwość , aby określić, ile rekordów ma być wyświetlanych na stronie (ta właściwość jest domyślnie ustawiona na wartość 10).

Ten interfejs stronicowania GridView, DetailsView i FormView można dostosować przy użyciu następujących właściwości:

  • PagerStyle wskazuje informacje o stylu dla interfejsu stronicowania; Może określać ustawienia, takie jak BackColor, ForeColor, CssClass, HorizontalAligni tak dalej.

  • PagerSettings Zawiera bevy właściwości, które mogą dostosować funkcjonalność interfejsu stronicowania; PageButtonCount wskazuje maksymalną liczbę liczbowych numerów stron wyświetlanych w interfejsie stronicowania (wartość domyślna to 10); Mode właściwość wskazuje sposób działania interfejsu stronicowania i można ustawić na:

    • NextPrevious wyświetla przyciski Dalej i Poprzednie, co umożliwia użytkownikowi przechodzenie do przodu lub do tyłu po jednej stronie naraz
    • NextPreviousFirstLast Oprócz przycisków Dalej i Poprzedni, dostępne są również przyciski Pierwsze i Ostatnie, dzięki czemu użytkownik może szybko przejść do pierwszej lub ostatniej strony danych
    • Numeric wyświetla serię numerów stron, dzięki czemu użytkownik może natychmiast przejść do dowolnej strony
    • NumericFirstLast oprócz numerów stron zawiera przyciski Pierwszy i Ostatni, dzięki czemu użytkownik może szybko przejść do pierwszej lub ostatniej strony danych; Przyciski Pierwsze/Ostatnie są wyświetlane tylko wtedy, gdy nie można dopasować wszystkich liczbowych numerów stron

Ponadto wszystkie kontrolki GridView, DetailsView i FormView oferują PageIndex właściwości i PageCount , które wskazują na przeglądaną bieżącą stronę oraz łączną liczbę stron danych. Właściwość PageIndex jest indeksowana od 0, co oznacza, że podczas wyświetlania pierwszej strony danych PageIndex będzie równa 0. PageCountZ drugiej strony rozpoczyna się liczenie od 1, co oznacza, że PageIndex jest to ograniczone do wartości z zakresu od 0 PageCount - 1do .

Poświęćmy chwilę, aby poprawić domyślny wygląd interfejsu stronicowania kontrolki GridView. W szczególności przyjrzyjmy się interfejsowi stronicowania wyrównanym do jasnoszaryego tła. Zamiast ustawiać te właściwości bezpośrednio za pośrednictwem właściwości GridView PagerStyle , utwórzmy klasę CSS o Styles.css nazwie PagerRowStyle , a następnie przypiszmy PagerStyle właściwość s CssClass za pomocą naszego motywu. Zacznij od otwarcia Styles.css i dodania następującej definicji klasy CSS:

.PagerRowStyle
{
    background-color: #ddd;
    text-align: right;
}

Następnie otwórz GridView.skin plik w folderze DataWebControls w folderze App_Themes . Jak omówiono w samouczku Strony wzorcowe i Nawigacja po witrynie , pliki skórek mogą służyć do określania domyślnych wartości właściwości dla kontrolki sieci Web. W związku z tym rozszerz istniejące ustawienia, aby uwzględnić ustawienie PagerStyle właściwości s CssClass na PagerRowStyle. Ponadto skonfigurujmy interfejs stronicowania tak, aby wyświetlał co najwyżej pięć przycisków stron liczbowych przy użyciu interfejsu NumericFirstLast stronicowania.

<asp:GridView runat="server" CssClass="DataWebControlStyle">
   <AlternatingRowStyle CssClass="AlternatingRowStyle" />
   <RowStyle CssClass="RowStyle" />
   <HeaderStyle CssClass="HeaderStyle" />
   <FooterStyle CssClass="FooterStyle" />
   <SelectedRowStyle CssClass="SelectedRowStyle" />
   <PagerStyle CssClass="PagerRowStyle" />
   <PagerSettings Mode="NumericFirstLast" PageButtonCount="5" />
</asp:GridView>

Środowisko użytkownika stronicowania

Rysunek 8 przedstawia stronę internetową po odwiedzeniu w przeglądarce po zaznaczeniu pola wyboru Włącz stronicowanie kontrolki GridView, a PagerStyle konfiguracje i PagerSettings zostały wykonane za pośrednictwem GridView.skin pliku. Zwróć uwagę, jak pokazano tylko dziesięć rekordów, a interfejs stronicowania wskazuje, że wyświetlamy pierwszą stronę danych.

Po włączeniu stronicowania tylko podzbiór rekordów jest wyświetlany jednocześnie

Rysunek 8. Po włączeniu stronicowania wyświetlane są tylko podzbiór rekordów (kliknij, aby wyświetlić obraz o pełnym rozmiarze)

Gdy użytkownik kliknie jeden z numerów stron w interfejsie stronicowania, zostanie wyświetlony komunikat zwrotny i ponowne załadowanie strony pokazujące, że żądane rekordy stron. Rysunek 9 przedstawia wyniki po wybraniu opcji wyświetlenia ostatniej strony danych. Zwróć uwagę, że ostatnia strona ma tylko jeden rekord; Wynika to z tego, że w sumie istnieje 81 rekordów, co daje osiem stron z 10 rekordami na stronę oraz jedną stronę z rekordem samotnym.

Kliknięcie numeru strony powoduje wyświetlenie ogłaszania zwrotnego i wyświetlenie odpowiedniego podzbioru rekordów

Rysunek 9. Kliknięcie numeru strony powoduje wyświetlenie ogłaszania zwrotnego i wyświetlenie odpowiedniego podzbioru rekordów (kliknij, aby wyświetlić obraz o pełnym rozmiarze)

Przepływ pracy Server-Side stronicowania

Gdy użytkownik końcowy kliknie przycisk w interfejsie stronicowania, rozpoczyna się ogłaszanie zwrotne i rozpoczyna się następujący przepływ pracy po stronie serwera:

  1. Zdarzenie GridView (lub DetailsView lub FormView) PageIndexChanging jest uruchamiane
  2. Obiekt ObjectDataSource ponownie żąda wszystkich danych z BLL; Wartości właściwości i PageSize s PageIndex GridView służą do określania, które rekordy zwrócone z BLL muszą być wyświetlane w siatce
  3. Zdarzenie GridView jest PageIndexChanged uruchamiane

W kroku 2 obiekt ObjectDataSource ponownie żąda wszystkich danych ze źródła danych. Ten styl stronicowania jest często określany jako domyślne stronicowanie, ponieważ jest to zachowanie stronicowania używane domyślnie podczas ustawiania AllowPaging właściwości na truewartość . Przy domyślnym stronicowaniu kontrolka internetowa danych naiwnie pobiera wszystkie rekordy dla każdej strony danych, mimo że tylko podzbiór rekordów jest faktycznie renderowany w kodzie HTML wysyłanym do przeglądarki. Jeśli dane bazy danych nie są buforowane przez usługę BLL lub ObjectDataSource, domyślne stronicowanie nie jest możliwe w przypadku wystarczająco dużych zestawów wyników lub aplikacji internetowych z wieloma równoczesnymi użytkownikami.

W następnym samouczku sprawdzimy, jak zaimplementować niestandardowe stronicowanie. Dzięki niestandardowemu stronicowaniu można konkretnie poinstruować obiekt ObjectDataSource, aby pobierał tylko dokładny zestaw rekordów potrzebnych dla żądanej strony danych. Jak można sobie wyobrazić, stronicowanie niestandardowe znacznie poprawia wydajność stronicowania za pomocą dużych zestawów wyników.

Uwaga

Podczas gdy domyślne stronicowanie nie jest odpowiednie w przypadku stronicowania za pośrednictwem wystarczająco dużych zestawów wyników lub witryn z wieloma równoczesnymi użytkownikami, należy pamiętać, że stronicowanie niestandardowe wymaga większej liczby zmian i wysiłków w celu zaimplementowania i nie jest tak proste, jak zaznaczenie pola wyboru (podobnie jak domyślne stronicowanie). W związku z tym domyślne stronicowanie może być idealnym wyborem dla witryn internetowych o małym ruchu lub w przypadku stronicowania za pomocą stosunkowo małych zestawów wyników, ponieważ znacznie łatwiej i szybciej wdrożyć.

Jeśli na przykład wiemy, że nigdy nie będziemy mieć więcej niż 100 produktów w naszej bazie danych, minimalny zysk wydajności, którego cieszy się niestandardowe stronicowanie, prawdopodobnie zostanie zrównoważony przez nakład pracy wymagany do zaimplementowania. Jeśli jednak możemy pewnego dnia mieć tysiące lub dziesiątki tysięcy produktów, nie implementowanie niestandardowego stronicowania znacznie utrudniłoby skalowalność naszej aplikacji.

Krok 4. Dostosowywanie środowiska stronicowania

Kontrolki sieci Web danych udostępniają wiele właściwości, które mogą służyć do ulepszania środowiska stronicowania użytkownika. Właściwość PageCount , na przykład, wskazuje liczbę wszystkich stron, podczas gdy PageIndex właściwość wskazuje bieżącą stronę odwiedzaną i można je ustawić, aby szybko przenieść użytkownika do określonej strony. Aby zilustrować sposób korzystania z tych właściwości w celu ulepszenia środowiska stronicowania użytkownika, dodajmy do naszej strony kontrolkę Etykieta sieci Web, która informuje użytkownika o aktualnie odwiedzanej stronie wraz z kontrolką DropDownList, która pozwala im szybko przejść do dowolnej danej strony.

Najpierw dodaj kontrolkę Etykieta sieci Web do strony, ustaw jej ID właściwość na PagingInformation, i wyczyść jej Text właściwość. Następnie utwórz procedurę obsługi zdarzeń dla zdarzenia GridView i DataBound dodaj następujący kod:

protected void Products_DataBound(object sender, EventArgs e)
{
    PagingInformation.Text = string.Format("You are viewing page {0} of {1}...",
        Products.PageIndex + 1, Products.PageCount);
}

Ta procedura obsługi zdarzeń przypisuje PagingInformation właściwość Etykieta Text do komunikatu informującego użytkownika o stronie, którą obecnie odwiedza Products.PageIndex + 1 z liczby stron Products.PageCount całkowitych (dodajemy 1 do Products.PageIndex właściwości, ponieważ PageIndex jest indeksowana od 0). Wybrałem właściwość assign this Label s Text w DataBound programie obsługi zdarzeń w przeciwieństwie do PageIndexChanged programu obsługi zdarzeń, ponieważ zdarzenie jest wyzwalane za każdym razem, gdy dane są powiązane z obiektem GridView, podczas DataBound gdy PageIndexChanged program obsługi zdarzeń jest uruchamiany tylko po zmianie indeksu strony. Gdy element GridView jest początkowo danymi powiązanymi z pierwszą wizytą strony, PageIndexChanging zdarzenie nie jest uruchamiane (podczas gdy DataBound zdarzenie działa).

Po dodaniu użytkownik jest teraz wyświetlany komunikat wskazujący, jaką stronę odwiedza, oraz liczbę wszystkich stron danych.

Wyświetlany jest bieżący numer strony i łączna liczba stron

Rysunek 10. Wyświetlana jest bieżąca liczba stron i całkowita liczba stron (kliknij, aby wyświetlić obraz pełnowymiarowy)

Oprócz kontrolki Etykieta dodajmy również kontrolkę DropDownList, która wyświetla numery stron w kontrolce GridView z wybraną aktualnie wyświetloną stroną. Oto pomysł, że użytkownik może szybko przejść z bieżącej strony do innej, po prostu wybierając nowy indeks strony z listy Rozwijanej. Zacznij od dodania listy rozwijanej do Projektant, ustawienia jej ID właściwości na PageList i sprawdzenia opcji Włącz autopostback z tagu inteligentnego.

Następnie wróć do procedury obsługi zdarzeń DataBound i dodaj następujący kod:

// Clear out all of the items in the DropDownList
PageList.Items.Clear();
// Add a ListItem for each page
for (int i = 0; i < Products.PageCount; i++)
{
    // Add the new ListItem
    ListItem pageListItem = new ListItem(string.Concat("Page ", i + 1), i.ToString());
    PageList.Items.Add(pageListItem);
    // select the current item, if needed
    if (i == Products.PageIndex)
        pageListItem.Selected = true;
}

Ten kod rozpoczyna się od wyczyszczenia elementów na liście rozwijanej PageList . Może to wydawać się zbędne, ponieważ nie spodziewa się zmiany liczby stron, ale inni użytkownicy mogą używać systemu jednocześnie, dodając lub usuwając rekordy z Products tabeli. Takie wstawiania lub usuwania mogą zmienić liczbę stron danych.

Następnie należy ponownie utworzyć numery stron i mieć te, które są domyślnie mapowane na bieżący element GridView PageIndex . Osiągamy to za pomocą pętli od 0 do PageCount - 1, dodając nową ListItem w każdej iteracji i ustawiając jej Selected właściwość na wartość true, jeśli bieżący indeks iteracji jest równy właściwości GridView s PageIndex .

Na koniec musimy utworzyć procedurę obsługi zdarzeń dla zdarzenia DropDownList SelectedIndexChanged , które jest uruchamiane za każdym razem, gdy użytkownik wybierze inny element z listy. Aby utworzyć tę procedurę obsługi zdarzeń, po prostu kliknij dwukrotnie Listę rozwijaną w Projektant, a następnie dodaj następujący kod:

protected void PageList_SelectedIndexChanged(object sender, EventArgs e)
{
    // Jump to the specified page
    Products.PageIndex = Convert.ToInt32(PageList.SelectedValue);
}

Jak pokazano na rysunku 11, zmiana właściwości GridView powoduje, że dane zostaną odbicia do kontrolki GridView PageIndex . W procedurze obsługi zdarzeń GridView DataBound wybrano odpowiednią listę Rozwijaną.ListItem

Użytkownik jest automatycznie pobierany do szóstej strony podczas wybierania elementu listy Drop-Down strony 6

Rysunek 11. Użytkownik jest automatycznie pobierany do szóstej strony po wybraniu elementu listy Drop-Down strony 6 (kliknij, aby wyświetlić obraz pełnowymiarowy)

Krok 5. Dodawanie obsługi sortowania Bi-Directional

Dodanie obsługi sortowania dwukierunkowego jest tak proste, jak dodawanie obsługi stronicowania po prostu sprawdź opcję Włącz sortowanie z tagu inteligentnego GridView (który ustawia właściwość GridView na AllowSortingtrue). Spowoduje to renderowanie każdego nagłówka pól GridView jako kolumny LinkButtons, które po kliknięciu powodują powrót i zwracają dane posortowane według klikniętej kolumny w kolejności rosnącej. Kliknięcie tego samego nagłówka LinkButton ponownie posortuje dane w kolejności malejącej.

Uwaga

Jeśli używasz niestandardowej warstwy dostępu do danych, a nie typu zestawu danych, być może nie masz opcji Włącz sortowanie w tagu inteligentnym GridView. Dostępne jest tylko pole wyboru GridViews powiązane ze źródłami danych, które natywnie obsługują sortowanie. Zestaw Danych Typed zapewnia obsługę sortowania gotowego do użycia, ponieważ ADO.NET DataTable udostępnia metodęSort, która po wywołaniu sortuje wartości DataTable dataRows przy użyciu określonych kryteriów.

Jeśli nazwa DAL nie zwraca obiektów, które natywnie obsługują sortowanie, należy skonfigurować obiekt ObjectDataSource w celu przekazania informacji sortowania do warstwy logiki biznesowej, które mogą sortować dane lub sortować dane według dal. W przyszłym samouczku dowiesz się, jak sortować dane w warstwach logiki biznesowej i dostępu do danych.

Sortowanie LinkButtons są renderowane jako hiperlinki HTML, których bieżące kolory (niebieski dla nieodwiedzonego łącza i ciemnoczerwony dla odwiedzonego linku) starcia z kolorem tła wiersza nagłówka. Zamiast tego mamy wszystkie linki wiersza nagłówka wyświetlane w kolorze białym, niezależnie od tego, czy zostały one odwiedzone, czy nie. Można to zrobić, dodając następujące elementy do Styles.css klasy:

.HeaderStyle a, .HeaderStyle a:visited
{
    color: White;
}

Ta składnia wskazuje na użycie białego tekstu podczas wyświetlania tych hiperlinków w elemecie używającym klasy HeaderStyle.

Po dodaniu tego arkusza CSS podczas odwiedzania strony za pośrednictwem przeglądarki ekran powinien wyglądać podobnie do rysunku 12. W szczególności rysunek 12 przedstawia wyniki po kliknięciu linku nagłówka pola Cena.

Zrzut ekranu przedstawiający okno Proste stronicowanie & Sortowanie z wynikami posortowane według kolumny Price (Cena) w kolejności rosnącej.

Rysunek 12. Wyniki zostały posortowane według wartości UnitPrice w kolejności rosnącej (kliknij, aby wyświetlić obraz pełnowymiarowy)

Badanie przepływu pracy sortowania

Wszystkie pola GridView pola BoundField, CheckBoxField, TemplateField itd. mają właściwość wskazującą SortExpression wyrażenie, które powinno służyć do sortowania danych po kliknięciu linku nagłówka sortowania tego pola. Obiekt GridView ma SortExpression również właściwość . Po kliknięciu przycisku LinkButton nagłówka sortowania element GridView przypisuje wartość tego pola SortExpression do jego SortExpression właściwości. Następnie dane są ponownie pobierane z obiektu ObjectDataSource i posortowane zgodnie z właściwością GridView.SortExpression Poniższa lista zawiera szczegółowe informacje o sekwencji kroków, które są wykonywane, gdy użytkownik końcowy sortuje dane w elemecie GridView:

  1. Zdarzenie sortowania usługi GridView jest uruchamiane
  2. Właściwość GridView SortExpression jest ustawiona na SortExpression pole, którego nagłówek sortowania LinkButton został kliknięty
  3. Obiekt ObjectDataSource ponownie pobiera wszystkie dane z biblioteki BLL, a następnie sortuje dane przy użyciu kontrolki GridView s SortExpression
  4. Właściwość GridView PageIndex jest resetowana do wartości 0, co oznacza, że podczas sortowania użytkownik jest zwracany do pierwszej strony danych (przy założeniu, że zaimplementowano obsługę stronicowania)
  5. Zdarzenie GridView jest Sorted wyzwalane

Podobnie jak w przypadku domyślnego stronicowania, domyślna opcja sortowania ponownie pobiera wszystkie rekordy z usługi BLL. W przypadku korzystania z sortowania bez stronicowania lub sortowania z domyślnym stronicowaniem nie ma możliwości obejścia tego trafienia wydajności (brak buforowania danych bazy danych). Jednak jak zobaczymy w przyszłym samouczku, można efektywnie sortować dane podczas korzystania z niestandardowego stronicowania.

Po powiązaniu obiektu ObjectDataSource z kontrolką GridView za pośrednictwem listy rozwijanej w tagu inteligentnym GridView każde pole GridView automatycznie ma przypisaną właściwość SortExpression do nazwy pola danych w ProductsRow klasie. Na przykład parametr ProductName BoundField s SortExpression jest ustawiony na ProductNamewartość , jak pokazano w następującym deklaratywnej adiustacji:

<asp:BoundField DataField="ProductName" HeaderText="Product"
    SortExpression="ProductName" />

Pole można skonfigurować tak, aby nie można było sortować, usuwając jego SortExpression właściwość (przypisując je do pustego ciągu). Aby to zilustrować, wyobraź sobie, że nie chcemy, aby nasi klienci sortować nasze produkty według ceny. Właściwość UnitPrice BoundField SortExpression można usunąć z deklaratywnego znaczników lub za pośrednictwem okna dialogowego Pola (dostępnego przez kliknięcie linku Edytuj kolumny w tagu inteligentnym GridView).

Zrzut ekranu przedstawiający okno Pola z wyróżnioną wartością Price (Cena) i SortExpression (SortExpression).

Rysunek 13. Wyniki zostały posortowane według wartości UnitPrice w kolejności rosnącej

Po usunięciu SortExpressionUnitPrice właściwości dla pola BoundField nagłówek jest renderowany jako tekst, a nie jako link, co uniemożliwia użytkownikom sortowanie danych według ceny.

Usuwając właściwość SortExpression, użytkownicy nie mogą już sortować produktów według ceny

Rysunek 14. Usunięcie właściwości SortExpression powoduje, że użytkownicy nie mogą już sortować produktów według ceny (kliknij, aby wyświetlić obraz pełnowymiarowy)

Programowe sortowanie kontrolki GridView

Zawartość elementu GridView można również sortować programowo przy użyciu metody GridView.Sort Wystarczy przekazać SortExpression wartość do sortowania według wartości ( SortDirectionAscending lub Descending), a dane gridView zostaną ponownie posortowane.

Wyobraź sobie, że powodem, dla którego wyłączyliśmy sortowanie, UnitPrice było to, że martwiliśmy się, że nasi klienci po prostu kupią tylko najniższe produkty. Chcemy jednak zachęcić ich do zakupu najdroższych produktów, więc chcielibyśmy, aby mogli sortować produkty według ceny, ale tylko od najdroższej ceny do najmniejszych.

Aby to zrobić, dodaj kontrolkę Sieć Web przycisku do strony, ustaw jej ID właściwość na SortPriceDescending, a jej Text właściwość na Sortuj według ceny. Następnie utwórz procedurę obsługi zdarzeń dla zdarzenia PrzyciskClick, klikając dwukrotnie kontrolkę Przycisk w Projektant. Dodaj następujący kod do tej procedury obsługi zdarzeń:

protected void SortPriceDescending_Click(object sender, EventArgs e)
{
    // Sort by UnitPrice in descending order
    Products.Sort("UnitPrice", SortDirection.Descending);
}

Kliknięcie tego przycisku zwraca użytkownika do pierwszej strony z produktami posortowanych według ceny, od najdroższych do najtańszych (zobacz Rysunek 15).

Kliknięcie przycisku zamówienia produktów z najdroższych do najmniejszych

Rysunek 15. Kliknięcie przycisku Orders the Products From the Most Expensive to the Least (Kliknij, aby wyświetlić obraz pełnowymiarowy)

Podsumowanie

W tym samouczku pokazano, jak zaimplementować domyślne możliwości stronicowania i sortowania, które były tak proste jak zaznaczenie pola wyboru. Gdy użytkownik sortuje dane lub strony, podobny przepływ pracy rozwija się:

  1. Po powrocie po awarii
  2. Zdarzenia wstępnego poziomu kontroli danych w sieci Web są wyzwalane (PageIndexChanging lub Sorting)
  3. Wszystkie dane są pobierane ponownie przez obiekt ObjectDataSource
  4. Zdarzenia po poziomie kontroli danych sieci Web są wyzwalane (PageIndexChanged lub Sorted)

Podczas implementowania podstawowych stronicowania i sortowania jest bryza, należy zwiększyć nakład pracy, aby korzystać z bardziej wydajnego niestandardowego stronicowania lub dalszego ulepszania interfejsu stronicowania lub sortowania. Przyszłe samouczki omówią te tematy.

Szczęśliwe programowanie!

Informacje o autorze

Scott Mitchell, autor siedmiu książek ASP/ASP.NET i założyciel 4GuysFromRolla.com, współpracuje z technologiami internetowymi firmy Microsoft od 1998 roku. Scott pracuje jako niezależny konsultant, trener i pisarz. Jego najnowsza książka to Sams Teach Yourself ASP.NET 2.0 w ciągu 24 godzin. Można do niego dotrzeć pod adresem mitchell@4GuysFromRolla.com. Lub za pośrednictwem swojego bloga, który można znaleźć na stronie http://ScottOnWriting.NET.