Filtragem mestre/detalhe com um controle DropDownList e GridView (VB)

por Scott Mitchell

Baixar PDF

Neste tutorial, veremos como exibir os registros de master em um controle DropDownList e os detalhes do item de lista selecionado em um GridView.

Introdução

Um tipo comum de relatório é o relatório de master/detalhes, no qual o relatório começa mostrando algum conjunto de registros "master". Em seguida, o usuário pode fazer uma busca detalhada em um dos registros master, exibindo assim os "detalhes" desse registro master. Relatórios mestre/detalhes são uma opção ideal para visualizar relações um para muitos, como um relatório mostrando todas as categorias e, em seguida, permitir que um usuário selecione uma categoria específica e exiba seus produtos associados. Além disso, relatórios de master/detalhes são úteis para exibir informações detalhadas de tabelas particularmente "amplas" (que têm muitas colunas). Por exemplo, o nível "master" de um relatório de master/detalhes pode mostrar apenas o nome do produto e o preço unitário dos produtos no banco de dados, e a busca detalhada em um determinado produto mostraria os campos de produto adicionais (categoria, fornecedor, quantidade por unidade e assim por diante).

Há muitas maneiras com as quais um relatório de master/detalhes pode ser implementado. Neste e nos próximos três tutoriais, examinaremos uma variedade de relatórios de master/detalhes. Neste tutorial, veremos como exibir os registros master em um controle DropDownList e os detalhes do item de lista selecionado em um GridView. Em particular, o relatório de master/detalhes deste tutorial listará as informações de categoria e produto.

Etapa 1: Exibindo as categorias em um DropDownList

Nosso relatório de master/detalhes listará as categorias em um DropDownList, com os produtos do item de lista selecionado exibidos mais abaixo na página em um GridView. A primeira tarefa à nossa frente, então, é ter as categorias exibidas em um DropDownList. Abra a FilterByDropDownList.aspx página na Filtering pasta, arraste um DropDownList da Caixa de Ferramentas para o designer da página e defina sua ID propriedade como Categories. Em seguida, clique no link Escolher Fonte de Dados na marca inteligente do DropDownList. Isso exibirá o assistente de Configuração da Fonte de Dados.

Figura 1: especificar a fonte de dados do DropDownList (clique para exibir a imagem em tamanho real)

Escolha adicionar um novo ObjectDataSource chamado CategoriesDataSource que invoca o CategoriesBLL método da GetCategories() classe.

Figura 2: Adicionar um novo objetoDataSource nomeado CategoriesDataSource (clique para exibir a imagem em tamanho real)

Figura 3: Optar por usar a CategoriesBLL classe (Clique para exibir a imagem em tamanho real)

Figura 4: configurar o ObjectDataSource para usar o GetCategories() método (clique para exibir a imagem em tamanho real)

Depois de configurar o ObjectDataSource, ainda precisamos especificar qual campo de fonte de dados deve ser exibido em DropDownList e qual deles deve ser associado como o valor do item de lista. Tenha o CategoryName campo como a exibição e CategoryID como o valor de cada item de lista.

Figura 5: fazer com que o DropDownList exiba o CategoryName campo e use CategoryID como o valor (clique para exibir a imagem em tamanho real)

Neste ponto, temos um controle DropDownList que é preenchido com os registros da Categories tabela (todos realizados em cerca de seis segundos). A Figura 6 mostra nosso progresso até agora quando exibido por meio de um navegador.

Figura 6: um Drop-Down Listas categorias atuais (clique para exibir a imagem em tamanho real)

Etapa 2: Adicionar o Products GridView

Essa última etapa em nosso relatório de master/detalhes é listar os produtos associados à categoria selecionada. Para fazer isso, adicione um GridView à página e crie um novo ObjectDataSource chamado productsDataSource. Fazer com que o productsDataSource controle corte seus dados do ProductsBLL método da GetProductsByCategoryID(categoryID) classe.

Figura 7: Selecione o GetProductsByCategoryID(categoryID) Método (Clique para exibir a imagem em tamanho real)

Depois de escolher esse método, o assistente ObjectDataSource nos solicita o valor do parâmetro do categoryID método. Para usar o valor do item DropDownList selecionado categories , defina a origem do parâmetro como Control e a ControlID como Categories.

Figura 8: defina o categoryID parâmetro como o valor de Categories DropDownList (clique para exibir a imagem em tamanho real)

Tire um momento para marcar nosso progresso em um navegador. Ao visitar a página pela primeira vez, esses produtos pertencem à categoria selecionada (Bebidas) são exibidos (conforme mostrado na Figura 9), mas alterar o DropDownList não atualiza os dados. Isso ocorre porque um postback deve ocorrer para que o GridView seja atualizado. Para fazer isso, temos duas opções (nenhuma das quais requer escrever qualquer código):

• Defina as categoriaspropriedade AutoPostBack do DropDownList como True. (Você pode fazer isso verificando a opção Habilitar AutoPostBack na marca inteligente do DropDownList.) Isso disparará um postback sempre que o item selecionado do DropDownList for alterado pelo usuário. Portanto, quando o usuário selecionar uma nova categoria no DropDownList, um postback será exibido e o GridView será atualizado com os produtos para a categoria recém-selecionada. (Esta é a abordagem que usei neste tutorial.)
• Adicione um controle Web button ao lado de DropDownList. Defina sua Text propriedade como Refresh ou algo semelhante. Com essa abordagem, o usuário precisará selecionar uma nova categoria e, em seguida, clicar no Botão. Clicar no Botão fará com que um postback e atualize o GridView para listar esses produtos da categoria selecionada.

As figuras 9 e 10 ilustram o relatório de master/detalhes em ação.

Figura 9: Ao visitar a página pela primeira vez, os produtos de bebidas são exibidos (clique para exibir a imagem em tamanho real)

Figura 10: selecionar um novo produto (produzir) causa automaticamente um PostBack, atualizando o GridView (clique para exibir a imagem em tamanho real)

Adicionando um item de lista "-- Escolher uma categoria --"

Ao visitar a FilterByDropDownList.aspx página pela primeira vez, as categorias do primeiro item de lista do DropDownList (Bebidas) são selecionadas por padrão, mostrando os produtos de bebidas no GridView. Em vez de mostrar os produtos da primeira categoria, talvez queiramos ter um item DropDownList selecionado que diga algo como "-- Escolha uma categoria --".

Para adicionar um novo item de lista ao DropDownList, vá para o janela Propriedades e clique nas reticências na Items propriedade . Adicione um novo item de lista com o Text "-- Escolher uma Categoria --" e o Value-1.

Figura 11: Adicionar um -- Escolher uma Categoria -- Item de Lista (Clique para exibir imagem em tamanho real)

Como alternativa, você pode adicionar o item de lista adicionando a seguinte marcação ao DropDownList:

<asp:DropDownList ID="categories" runat="server"
    AutoPostBack="True" DataSourceID="categoriesDataSource"
    DataTextField="CategoryName" DataValueField="CategoryID"
    EnableViewState="False">
    <asp:ListItem Value="-1">
       -- Choose a Category --
    </asp:ListItem>
</asp:DropDownList>

Além disso, precisamos definir o controle AppendDataBoundItems DropDownList como True porque quando as categorias estiverem associadas ao DropDownList do ObjectDataSource, eles substituirão todos os itens de lista adicionados manualmente se AppendDataBoundItems não for True.

Figura 12: Definir a AppendDataBoundItems propriedade como True

Após essas alterações, ao visitar a página pela primeira vez, a opção "-- Escolher uma Categoria --" será selecionada e nenhum produto será exibido.

Figura 13: Na página inicial, não há produtos carregados (clique para exibir a imagem em tamanho real)

O motivo pelo qual nenhum produto é exibido quando porque o item de lista "-- Escolher uma Categoria --" está selecionado é porque seu valor é -1 e não há produtos no banco de dados com um CategoryID de -1. Se esse for o comportamento desejado, você terminará neste momento! Se, no entanto, você quiser exibir todas as categorias quando o item de lista "-- Escolher uma Categoria --" estiver selecionado, retorne à classe e personalize o GetProductsByCategoryID(categoryID) método para ProductsBLL que ele invoque o GetProducts() método se o parâmetro passado categoryID for menor que zero:

Public Function GetProductsByCategoryID(categoryID As Integer) _
    As Northwind.ProductsDataTable
    If categoryID < 0 Then
        Return GetProducts()
    Else
        Return Adapter.GetProductsByCategoryID(categoryID)
    End If
End Function

A técnica usada aqui é semelhante à abordagem que usamos para exibir todos os fornecedores novamente no tutorial Parâmetros Declarativos , embora, para este exemplo, estejamos usando um valor de -1 para indicar que todos os registros devem ser recuperados em vez Nothingde . Isso ocorre porque o categoryID parâmetro do GetProductsByCategoryID(categoryID) método espera como valor inteiro passado, enquanto no tutorial Parâmetros Declarativos estávamos passando um parâmetro de entrada de cadeia de caracteres.

A Figura 14 mostra uma captura de tela de FilterByDropDownList.aspx quando a opção "-- Escolher uma Categoria --" está selecionada. Aqui, todos os produtos são exibidos por padrão e o usuário pode restringir a exibição escolhendo uma categoria específica.

Figura 14: Todos os produtos agora estão listados por padrão (clique para exibir a imagem em tamanho real)

Resumo

Ao exibir dados relacionados hierarquicamente, geralmente ajuda a apresentar os dados usando relatórios master/detalhes, dos quais o usuário pode começar a examinar os dados da parte superior da hierarquia e fazer drill down em detalhes. Neste tutorial, examinamos a criação de um relatório simples de master/detalhes mostrando os produtos de uma categoria selecionada. Isso foi feito usando um DropDownList para a lista de categorias e um GridView para os produtos pertencentes à categoria selecionada.

No próximo tutorial , levaremos a interface DropDownList uma etapa adiante, usando duas DropDownLists.

Programação feliz!

Sobre o autor

Scott Mitchell, autor de sete livros do ASP/ASP.NET e fundador da 4GuysFromRolla.com, trabalha com tecnologias da Microsoft Web desde 1998. Scott trabalha como consultor independente, treinador e escritor. Seu último livro é Sams Teach Yourself ASP.NET 2.0 em 24 Horas. Ele pode ser contatado em mitchell@4GuysFromRolla.com. ou através de seu blog, que pode ser encontrado em http://ScottOnWriting.NET.

AnteriorAvançar