Partilhar via


Dados de relatório de paginação e classificação (VB)

por Scott Mitchell

Descarregar PDF

A paginação e a classificação são dois recursos muito comuns ao exibir dados em um aplicativo on-line. Neste tutorial, daremos uma primeira olhada na adição de classificação e paginação aos nossos relatórios, que desenvolveremos em tutoriais futuros.

Introdução

A paginação e a classificação são dois recursos muito comuns ao exibir dados em um aplicativo on-line. Por exemplo, ao pesquisar ASP.NET livros em uma livraria online, pode haver centenas desses livros, mas o relatório que lista os resultados da pesquisa lista apenas dez correspondências por página. Além disso, os resultados podem ser classificados por título, preço, contagem de páginas, nome do autor e assim por diante. Embora os últimos 23 tutoriais tenham examinado como criar uma variedade de relatórios, incluindo interfaces que permitem adicionar, editar e excluir dados, não analisamos como classificar dados e os únicos exemplos de paginação que vimos foram com os controles DetailsView e FormView.

Neste tutorial, veremos como adicionar classificação e paginação aos nossos relatórios, o que pode ser feito simplesmente marcando algumas caixas de seleção. Infelizmente, essa implementação simplista tem suas desvantagens: a interface de classificação deixa um pouco a desejar e as rotinas de paginação não são projetadas para paginação eficiente através de grandes conjuntos de resultados. Tutoriais futuros explorarão como superar as limitações das soluções de paginação e classificação prontas para uso.

Etapa 1: Adicionando as páginas da Web do tutorial de paginação e classificação

Antes de começarmos este tutorial, vamos primeiro reservar um momento para adicionar as ASP.NET páginas que precisaremos para este tutorial e as próximas três. Comece criando uma nova pasta no projeto chamado PagingAndSorting. Em seguida, adicione as seguintes cinco páginas ASP.NET a esta pasta, tendo todas elas configuradas para usar a página Site.mastermestra :

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

Crie uma pasta PagingAndSorting e adicione as páginas do tutorial ASP.NET

Figura 1: Criar uma Pasta PagingAndSorting e adicionar as páginas do tutorial ASP.NET

Em seguida, abra a Default.aspx página e arraste o SectionLevelTutorialListing.ascx Controle de Usuário da UserControls pasta para a superfície Design. Esse Controle de Usuário, que criamos no tutorial Páginas Mestras e Navegação do Site , enumera o mapa do site e exibe esses tutoriais na seção atual em uma lista com marcadores.

Adicione o controle de usuário SectionLevelTutorialListing.ascx ao Default.aspx

Figura 2: Adicione o controle de usuário SectionLevelTutorialListing.ascx ao Default.aspx

Para que a lista com marcadores exiba os tutoriais de paginação e classificação que iremos criar, precisamos adicioná-los ao mapa do site. Abra o Web.sitemap arquivo e adicione a seguinte marcação após a marcação do nó Editar, inserir e excluir mapa do site:

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

Atualizar o mapa do site para incluir as novas páginas ASP.NET

Figura 3: Atualizar o mapa do site para incluir as novas páginas ASP.NET

Etapa 2: Exibindo informações do produto em um GridView

Antes de realmente implementarmos os recursos de paginação e classificação, vamos primeiro criar um GridView padrão não classificável e não paginável que lista as informações do produto. Esta é uma tarefa que já fizemos muitas vezes antes ao longo desta série de tutoriais, então essas etapas devem ser familiares. Comece abrindo a SimplePagingSorting.aspx página e arraste um controle GridView da Caixa de Ferramentas para o Designer, definindo sua ID propriedade como Products. Em seguida, crie um novo ObjectDataSource que use o método s GetProducts() da classe ProductsBLL para retornar todas as informações do produto.

Recuperar informações sobre todos os produtos usando o método GetProducts()

Figura 4: Recuperar informações sobre todos os produtos usando o método GetProducts()

Como este relatório é um relatório somente leitura, não há necessidade de mapear os métodos Insert(), Update(), ou Delete() do ObjectDataSource para métodos correspondentes ProductsBLL. Portanto, escolha (Nenhum) na lista suspensa para as guias UPDATE, INSERT, e DELETE.

Escolha a opção (Nenhum) na lista Drop-Down nas abas UPDATE, INSERT e DELETE

Figura 5: Escolha a opção (nenhuma) na lista de Drop-Down nas guias UPDATE, INSERT e DELETE

Em seguida, vamos personalizar os campos do GridView para que apenas os nomes de produtos, fornecedores, categorias, preços e estado de descontinuação sejam exibidos. Além disso, sinta-se à vontade para fazer quaisquer alterações de formatação no nível do campo, como ajustar as HeaderText propriedades ou formatar o preço como uma moeda. Após essas alterações, a marcação declarativa do GridView deve ser semelhante à seguinte:

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

A Figura 6 mostra o nosso progresso até agora quando visualizada através de um navegador. Observe que a página lista todos os produtos em uma tela, mostrando o nome, categoria, fornecedor, preço e status descontinuado de cada produto.

Cada um dos produtos está listado

Figura 6: Cada um dos produtos está listado (Clique para visualizar a imagem em tamanho real)

Etapa 3: Adicionando suporte a paginação

Listar todos os produtos em uma tela pode levar a uma sobrecarga de informações para o usuário que examina os dados. Para ajudar a tornar os resultados mais gerenciáveis, podemos dividir os dados em páginas menores de dados e permitir que o usuário percorra os dados uma página de cada vez. Para fazer isso, basta marcar a caixa de seleção Ativar paginação do smart tag do GridView (isso define a propriedade do AllowPaging GridView como true).

Marque a caixa de seleção Ativar paginação para adicionar suporte à paginação

Figura 7: Marque a caixa de seleção Ativar paginação para adicionar suporte à paginação (Clique para visualizar a imagem em tamanho real)

Habilitar a paginação limita o número de registros mostrados por página e adiciona uma interface de paginação ao GridView. A interface de paginação padrão, mostrada na Figura 7, é uma série de números de página, permitindo que o usuário navegue rapidamente de uma página de dados para outra. Essa interface de paginação deve parecer familiar, como vimos ao adicionar suporte de paginação aos controles DetailsView e FormView em tutoriais anteriores.

Os controles DetailsView e FormView mostram apenas um único registro por página. O GridView, no entanto, consulta sua PageSize propriedade para determinar quantos registros mostrar por página (essa propriedade assume como padrão um valor de 10).

Essa interface de paginação de GridView, DetailsView e FormView pode ser personalizada usando as seguintes propriedades:

  • PagerStyleindica as informações de estilo para a interface de paginação; pode especificar configurações como BackColor, ForeColor, , CssClassHorizontalAlign, e assim por diante.

  • PagerSettings contém uma série de propriedades que podem personalizar a funcionalidade da interface de paginação; PageButtonCount indica o número máximo de números de página numéricos exibidos na interface de paginação (o padrão é 10); a Mode propriedade indica como a interface de paginação opera e pode ser definida como:

    • NextPrevious mostra os botões Avançar e Anterior, permitindo que o usuário avance ou retroceda uma página de cada vez
    • NextPreviousFirstLast além dos botões Avançar e Anterior, os botões Primeiro e Último também estão incluídos, permitindo que o usuário se mova rapidamente para a primeira ou última página de dados
    • Numeric mostra uma série de números de página, permitindo que o usuário salte imediatamente para qualquer página
    • NumericFirstLast além dos números de página, inclui os botões Primeiro e Último, permitindo que o usuário passe rapidamente para a primeira ou última página de dados; os botões Primeiro/Último só são mostrados se todos os números de página numéricos não se ajustarem

Além disso, GridView, DetailsView e FormView oferecem as PageIndex propriedades e PageCount , que indicam a página atual que está sendo visualizada e o número total de páginas de dados, respectivamente. A PageIndex propriedade é indexada a partir de 0, o que significa que ao visualizar a primeira página de dados PageIndex será igual a 0. PageCount, por outro lado, começa a contar em 1, o que significa que PageIndex se limita aos valores entre 0 e PageCount - 1.

Vamos reservar um momento para melhorar a aparência padrão da interface de paginação do GridView. Vamos alinhar especificamente a interface de paginação à direita, com um fundo cinza claro. Em vez de definir essas propriedades diretamente através da propriedade PagerStyle de GridView, vamos criar uma classe CSS em Styles.css nomeada PagerRowStyle e, em seguida, atribuir a propriedade PagerStyleCssClass através do nosso Tema. Comece abrindo Styles.css e adicionando a seguinte definição de classe CSS:

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

Em seguida, abra o arquivo GridView.skin na pasta DataWebControls dentro da pasta App_Themes. Como discutimos no tutorial Páginas mestras e navegação no site , os arquivos de capa podem ser usados para especificar os valores de propriedade padrão para um controle da Web. Portanto, ajuste as configurações existentes para definir a propriedade PagerStyle s CssClass para PagerRowStyle. Além disso, vamos configurar a interface de paginação para mostrar no máximo cinco botões numéricos de página usando a interface de paginação NumericFirstLast.

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

A experiência do usuário Paging

Figura 8 mostra a página Web quando visitada por meio de um navegador depois que a caixa de seleção Ativar Paginação do GridView foi marcada e as PagerStyle e PagerSettings configurações foram feitas através do ficheiro GridView.skin. Observe como apenas dez registros são mostrados e a interface de paginação indica que estamos visualizando a primeira página de dados.

Com a paginação ativada, apenas um subconjunto dos registros é exibido de cada vez

Figura 8: Com a paginação ativada, apenas um subconjunto dos registros é exibido de cada vez (Clique para visualizar a imagem em tamanho real)

Quando o utilizador clica num dos números de página na interface de paginação, é feito um postback e a página é recarregada, mostrando os registos da página solicitada. A Figura 9 mostra os resultados depois de optar por visualizar a página final dos dados. Observe que a página final tem apenas um registro; Isto porque existem 81 registos no total, resultando em oito páginas de 10 registos por página mais uma página com um registo solitário.

Clicar em um número de página causa um postback e mostra o subconjunto apropriado de registros

Figura 9: Clicar em um número de página causa um postback e mostra o subconjunto apropriado de registros (Clique para visualizar a imagem em tamanho real)

Fluxo de trabalho de Server-Side de paginação

Quando o usuário final clica em um botão na interface de paginação, um postback ocorre e o seguinte fluxo de trabalho do lado do servidor começa:

  1. O evento GridView s (ou DetailsView ou FormView) PageIndexChanging é acionado
  2. O ObjectDataSource re-solicita todos os dados da BLL; os valores de propriedade do GridView com as tags PageIndex e PageSize são usados para determinar quais registros retornados da BLL precisam ser exibidos no GridView.
  3. O evento GridView s PageIndexChanged é acionado

Na Etapa 2, o ObjectDataSource solicita novamente todos os dados de sua fonte de dados. Esse estilo de paginação é comumente chamado de paginação padrão, pois é o comportamento de paginação usado por padrão ao definir a AllowPaging propriedade como true. Com a paginação padrão, o controle da Web de dados recupera ingenuamente todos os registros de cada página de dados, mesmo que apenas um subconjunto de registros seja realmente renderizado no HTML enviado para o navegador. A menos que os dados do banco de dados sejam armazenados em cache pela BLL ou ObjectDataSource, a paginação padrão é inviável para conjuntos de resultados suficientemente grandes ou para aplicativos Web com muitos usuários simultâneos.

No próximo tutorial, examinaremos como implementar a paginação personalizada. Com a paginação personalizada, você pode instruir especificamente o ObjectDataSource a recuperar apenas o conjunto preciso de registros necessários para a página de dados solicitada. Como você pode imaginar, a paginação personalizada melhora muito a eficiência da paginação através de grandes conjuntos de resultados.

Observação

Embora a paginação padrão não seja adequada ao paginar através de conjuntos de resultados suficientemente grandes ou para sites com muitos usuários simultâneos, perceba que a paginação personalizada requer mais alterações e esforço para implementar e não é tão simples quanto marcar uma caixa de seleção (como é a paginação padrão). Portanto, a paginação padrão pode ser a escolha ideal para sites pequenos e de baixo tráfego ou ao paginar através de conjuntos de resultados relativamente pequenos, pois é muito mais fácil e rápido de implementar.

Por exemplo, se soubermos que nunca teremos mais de 100 produtos em nosso banco de dados, o ganho mínimo de desempenho desfrutado pela paginação personalizada provavelmente será compensado pelo esforço necessário para implementá-la. Se, no entanto, um dia pudermos ter milhares ou dezenas de milhares de produtos, não implementar a paginação personalizada prejudicaria muito a escalabilidade do nosso aplicativo.

Etapa 4: Personalizando a experiência de paginação

Os controles da Web de dados fornecem várias propriedades que podem ser usadas para aprimorar a experiência de paginação do usuário. A PageCount propriedade, por exemplo, indica quantas páginas totais existem, enquanto a PageIndex propriedade indica a página atual que está sendo visitada e pode ser definida para mover rapidamente um usuário para uma página específica. Para ilustrar como usar essas propriedades para melhorar a experiência de paginação do usuário, deixe s adicionar um controle Label Web à nossa página que informa ao usuário qual página ele está visitando no momento, juntamente com um controle DropDownList que permite que ele pule rapidamente para qualquer página.

Primeiro, adicione um controle Label Web à sua página, defina sua ID propriedade como PagingInformatione limpe sua Text propriedade. Em seguida, crie um manipulador de eventos para o evento GridView s DataBound e adicione o seguinte código:

Protected Sub Products_DataBound(ByVal sender As Object, ByVal e As System.EventArgs) _
    Handles Products.DataBound
    PagingInformation.Text = String.Format("You are viewing page {0} of {1}...", _
        Products.PageIndex + 1, Products.PageCount)
End Sub

Este manipulador de eventos atribui à propriedade PagingInformation do Label Text uma mensagem informando ao utilizador sobre a página que ele está a visitar Products.PageIndex + 1 de um total de Products.PageCount páginas (adicionamos 1 à propriedade Products.PageIndex porque PageIndex é indexada começando em 0). Escolhi atribuir esta propriedade Label s Text no DataBound manipulador de eventos em vez do PageIndexChanged manipulador de eventos porque o DataBound evento é acionado sempre que os dados são vinculados ao GridView, enquanto o PageIndexChanged manipulador de eventos só é acionado quando o índice de página é alterado. Quando o GridView é inicialmente vinculado a dados na primeira visita à página, o evento PageIndexChanging não é acionado (enquanto o evento DataBound é acionado).

Com esta adição, é agora mostrada ao utilizador uma mensagem que indica que página está a visitar e quantas páginas totais de dados existem.

O número de página atual e o número total de páginas são exibidos

Figura 10: O número de página atual e o número total de páginas são exibidos (Clique para visualizar a imagem em tamanho real)

Além do controle Label, vamos também adicionar um controle DropDownList que lista os números de página no GridView com a página visualizada no momento selecionada. A ideia aqui é que o usuário possa saltar rapidamente da página atual para outra simplesmente selecionando o novo índice de página no DropDownList. Comece por adicionar um DropDownList ao Designer, definindo a sua propriedade ID como PageList e marcando a opção Enable AutoPostBack a partir da sua smart tag.

Em seguida, retorne ao DataBound manipulador de eventos e adicione o seguinte código:

' Clear out all of the items in the DropDownList
PageList.Items.Clear()
' Add a ListItem for each page
For i As Integer = 0 To Products.PageCount - 1
    ' Add the new ListItem
    Dim pageListItem As New ListItem(String.Concat("Page ", i + 1), i.ToString())
    PageList.Items.Add(pageListItem)
    ' select the current item, if needed
    If i = Products.PageIndex Then
        pageListItem.Selected = True
    End If
Next

Esse código começa limpando os itens no PageList DropDownList. Isso pode parecer supérfluo, já que não se esperaria que o número de páginas mudasse, mas outros usuários podem estar usando o sistema simultaneamente, adicionando ou removendo registros da Products tabela. Tais inserções ou supressões podem alterar o número de páginas de dados.

Em seguida, precisamos criar novamente os números de página e garantir que aquele que é mapeado para o GridView atual PageIndex seja selecionado por padrão. Fazemos isso com um loop de 0 a PageCount - 1, adicionando um novo ListItem a cada iteração e definindo a sua propriedade Selected como verdadeira se o índice da iteração atual for igual à propriedade PageIndex do GridView.

Finalmente, precisamos criar um manipulador de eventos para o evento s SelectedIndexChanged DropDownList, que é acionado cada vez que o usuário escolhe um item diferente da lista. Para criar esse manipulador de eventos, basta clicar duas vezes em DropDownList no Designer e adicionar o seguinte código:

Protected Sub PageList_SelectedIndexChanged(sender As Object, e As System.EventArgs) _
    Handles PageList.SelectedIndexChanged
        ' Jump to the specified page
        Products.PageIndex = Convert.ToInt32(PageList.SelectedValue)
End Sub

Como mostra a Figura 11, a simples alteração da propriedade de GridView faz com que os dados sejam redirecionados PageIndex para o GridView. No manipulador de eventos GridView DataBound , o DropDownList ListItem apropriado é selecionado.

O usuário é automaticamente levado para a sexta página ao selecionar a página 6 Drop-Down item de lista

Figura 11: O usuário é levado automaticamente para a sexta página ao selecionar o item de lista de Drop-Down da página 6 (Clique para visualizar a imagem em tamanho real)

Etapa 5: Adicionando suporte de ordenação para Bi-Directional

Adicionar suporte à classificação bidirecional é tão simples quanto adicionar suporte à paginação: basta marcar a opção Ativar classificação na marca inteligente do GridView (que define a propriedade s AllowSorting do GridView como true). Isso apresenta cada um dos cabeçalhos dos campos do GridView como LinkButtons que, ao serem clicados, causam um postback e retornam os dados classificados pela coluna clicada em ordem crescente. Clicar novamente no mesmo cabeçalho LinkButton reordena os dados em ordem decrescente.

Observação

Se o utilizador estiver a usar uma camada de acesso a dados personalizada em vez de um conjunto de dados tipado, poderá não ter a opção de Habilitar classificação na tag inteligente do GridView. Somente GridViews vinculados a fontes de dados que suportam nativamente a classificação têm essa caixa de seleção disponível. O DataSet Tipado fornece suporte de classificação imediato, já que o ADO.NET DataTable tem um método Sort que, quando invocado, classifica os DataRows do DataTable usando os critérios especificados.

Se sua DAL não retornar objetos que suportam nativamente a classificação, você precisará configurar o ObjectDataSource para passar informações de classificação para a Camada de Lógica de Negócios, que pode classificar os dados ou fazer com que os dados sejam classificados pelo DAL. Exploraremos como classificar dados nas camadas de lógica de negócios e acesso a dados em um tutorial futuro.

Os botões de ligação de classificação são renderizados como hiperligações HTML, cujas cores presentes (azul para um link não visitado e vermelho escuro para um link visitado) contrastam com a cor de plano de fundo da linha do cabeçalho. Em vez disso, deixe que todos os links de linha de cabeçalho sejam exibidos em branco, independentemente de terem sido visitados ou não. Isso pode ser feito adicionando o seguinte à Styles.css classe:

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

Essa sintaxe indica o uso de texto branco ao exibir esses hiperlinks em um elemento que usa a classe HeaderStyle.

Após essa adição de CSS, ao visitar a página através de um navegador, sua tela deve ser semelhante à Figura 12. Em particular, a Figura 12 mostra os resultados após o link do cabeçalho do campo Preço ter sido clicado.

Captura de ecrã de Tutoriais de Trabalho com Dados na página Paginação Simples & Ordenação mostrando os resultados ordenados pela coluna Preço por ordem crescente.

Figura 12: Os resultados foram classificados pelo preço unitário em ordem crescente (Clique para visualizar a imagem em tamanho real)

Examinando o fluxo de trabalho de classificação

Todos os campos GridView BoundField, CheckBoxField, TemplateField e assim por diante têm uma SortExpression propriedade que indica a expressão que deve ser usada para classificar os dados quando o link de cabeçalho de classificação desse campo é clicado. O GridView também tem uma propriedade SortExpression. Quando um LinkButton do cabeçalho de classificação é clicado, o GridView atribui o valor desse SortExpression campo à sua propriedade SortExpression. Em seguida, os dados são recuperados novamente do ObjectDataSource e classificados de acordo com a propriedade s SortExpression de GridView. A lista a seguir detalha a sequência de etapas que ocorre quando um usuário final classifica os dados em um GridView:

  1. O evento de classificação de GridView é acionado
  2. A propriedade SortExpression do GridView é definida como a SortExpression do campo cujo cabeçalho de classificação foi clicado pelo LinkButton
  3. O ObjectDataSource recupera novamente todos os dados da BLL e, em seguida, classifica os dados usando o GridView s SortExpression
  4. A propriedade s PageIndex de GridView é redefinida para 0, o que significa que, ao classificar, o usuário retorna à primeira página de dados (supondo que o suporte à paginação tenha sido implementado)
  5. O evento GridView s Sorted é acionado

Como na paginação padrão, a opção de classificação padrão recupera novamente todos os registros da BLL. Ao usar a classificação sem paginação ou ao usar a classificação com a paginação padrão, não há como contornar esse impacto de desempenho (exceto armazenar em cache os dados do banco de dados). No entanto, como veremos em um tutorial futuro, é possível classificar dados de forma eficiente ao usar a paginação personalizada.

Ao associar um ObjectDataSource ao GridView através da lista suspensa na etiqueta inteligente do GridView, cada campo do GridView automaticamente tem sua SortExpression propriedade definida para o nome do campo de dados na ProductsRow classe. Por exemplo, o ProductName BoundField s SortExpression é definido como ProductName, conforme mostrado na seguinte marcação declarativa:

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

Um campo pode ser configurado para que não possa ser classificado limpando sua SortExpression propriedade (atribuindo-o a uma cadeia de caracteres vazia). Para ilustrar isso, imagine que não queríamos deixar nossos clientes classificarem nossos produtos por preço. A propriedade UnitPrice de BoundField SortExpression pode ser removida da marcação declarativa ou através da caixa de diálogo Campos (acessível ao clicar no link Editar Colunas na Smart Tag do GridView).

Captura de ecrã da janela Campos onde o campo Preço está selecionado e a propriedade SortExpression está realçada.

Figura 13: Os resultados foram ordenados pelo preço unitário por ordem crescente

Uma vez que a SortExpression propriedade tenha sido removida para o UnitPrice BoundField, o cabeçalho é processado como texto em vez de como um link, impedindo assim que os usuários classifiquem os dados por preço.

Ao remover a propriedade SortExpression, os usuários não podem mais classificar os produtos por preço

Figura 14: Ao remover a propriedade SortExpression, os usuários não podem mais classificar os produtos por preço (Clique para visualizar a imagem em tamanho real)

Classificando programaticamente o GridView

Você também pode classificar o conteúdo do GridView programaticamente usando o método s SortGridView. Basta passar o SortExpression valor para classificar junto com o SortDirection (Ascending ou Descending), e os dados do GridView serão reclassificados.

Imagine que o motivo pelo qual desativámos a classificação por UnitPrice foi porque estávamos preocupados que os nossos clientes simplesmente comprassem apenas os produtos de preço mais baixo. No entanto, queremos incentivá-los a comprar os produtos mais caros, por isso gostaríamos que pudessem classificar os produtos por preço, mas apenas do preço mais caro para o menos.

Para fazer isso, adicione um controle Web Button à página, defina sua ID propriedade como SortPriceDescending, e sua Text propriedade como Classificar por Preço. Em seguida, crie um manipulador de eventos para o evento Button s Click clicando duas vezes no controle Button no Designer. Adicione o seguinte código a este manipulador de eventos:

Protected Sub SortPriceDescending_Click(sender As Object, e As System.EventArgs) _
    Handles SortPriceDescending.Click
        'Sort by UnitPrice in descending order
        Products.Sort("UnitPrice", SortDirection.Descending)
End Sub

Clicar nesse botão retorna o usuário à primeira página com os produtos classificados por preço, do mais caro ao menos caro (veja a Figura 15).

Clicando no botão encomenda os produtos do mais caro para o menos caro

Figura 15: Clicar no botão Encomenda os produtos do mais caro para o menos (Clique para ver a imagem em tamanho real)

Resumo

Neste tutorial, vimos como implementar recursos padrão de paginação e classificação, ambos tão fáceis quanto marcar uma caixa de seleção! Quando um usuário classifica ou percorre dados, um fluxo de trabalho semelhante é desdobrado:

  1. Segue-se um postback
  2. O controlo Web de dados dispara o evento pré-nível (PageIndexChanging ou Sorting)
  3. Todos os dados são recuperados novamente pelo ObjectDataSource
  4. O controle da Web de dados é acionado em eventos pós-nível (PageIndexChanged ou Sorted)

Embora a implementação de paginação e classificação básicas seja muito fácil, mais esforço deve ser feito para utilizar a paginação personalizada mais eficiente ou para melhorar ainda mais a interface de paginação ou classificação. Tutoriais futuros explorarão esses tópicos.

Feliz Programação!

Sobre o Autor

Scott Mitchell, autor de sete livros sobre ASP/ASP.NET e fundador da 4GuysFromRolla.com, trabalha com tecnologias Web da Microsoft desde 1998. Scott trabalha como consultor, formador e escritor independente. Seu último livro é Sams Teach Yourself ASP.NET 2.0 in 24 Hours. Ele pode ser contatado em mitchell@4GuysFromRolla.com.