Nota
O acesso a esta página requer autorização. Pode tentar iniciar sessão ou alterar os diretórios.
O acesso a esta página requer autorização. Pode tentar alterar os diretórios.
por Scott Mitchell
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.master
mestra :
Default.aspx
SimplePagingSorting.aspx
EfficientPaging.aspx
SortParameter.aspx
CustomSortingUI.aspx
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.
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>
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.
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.
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.
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
).
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:
PagerStyle
indica as informações de estilo para a interface de paginação; pode especificar configurações comoBackColor
,ForeColor
, ,CssClass
HorizontalAlign
, 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); aMode
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 PagerStyle
CssClass
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.
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.
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:
- O evento GridView s (ou DetailsView ou FormView)
PageIndexChanging
é acionado - O ObjectDataSource re-solicita todos os dados da BLL; os valores de propriedade do GridView com as tags
PageIndex
ePageSize
são usados para determinar quais registros retornados da BLL precisam ser exibidos no GridView. - 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 PagingInformation
e 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.
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.
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.
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:
- O evento de classificação de GridView é acionado
- A propriedade
SortExpression
do GridView é definida como aSortExpression
do campo cujo cabeçalho de classificação foi clicado pelo LinkButton - O ObjectDataSource recupera novamente todos os dados da BLL e, em seguida, classifica os dados usando o GridView s
SortExpression
- 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) - 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).
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.
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 Sort
GridView. 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).
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:
- Segue-se um postback
- O controlo Web de dados dispara o evento pré-nível (
PageIndexChanging
ouSorting
) - Todos os dados são recuperados novamente pelo ObjectDataSource
- O controle da Web de dados é acionado em eventos pós-nível (
PageIndexChanged
ouSorted
)
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.