Translate this page now :



»Programação
»Programação.NET
»Banco de Dados
»Webdesign
»Office
» Certificações Microsoft 4
»Treinamentos4
»Programação 4
»Webdesign«
»Office & User Tips«
»Grupos de Usuários
»Células Acadêmicas«
intcontpiada : 118
Brincando de Deus
Você já está cadastrado e participa do grupo de usuários de sua cidade ? Se não, comente o porque.
 
 
Faça um pequeno teste com 10 questões de VB
.:.
Teste seus conhecimentos em Visual Basic, SQL Server e ASP 3.0 com nossas provas on-line
.:.
Aprimore seus conhecimentos em programação com nosso treinamento on-line de lógica de programação
.:.
Veja nosso calendário de treinamentos
Gostou da Página?
Então

para um amigo!
 





Por Dennes Torres
dennes@bufaloinfo.com.br
Dennes Torres possui as certificações MCAD, MCSD,MCSE, MCDBA e MCT. Atualmente atua Como diretor da Búfalo Informática, líder do grupo de usuários DevASPNet no Rio de Janeiro e membro da liderança dos grupos getWindows e devSQL, também do Rio de Janeiro, podendo sempre ser encontrado na lista de discussão do grupo DevASPNet (devaspnet-subscribe@yahoogrupos.com.br) bem como nas reuniões do grupo. Mantém dois blogs em http://cidadaocarioca.blogspot.com

Utilizando a CascadingDropDown do Atlas

Pesquisa personalizada
Pesquisar Dicas:






 

Neste artigo vamos ver como funciona a CascadingDropDown. Este webControl faz parte do Atlas toolkit, um conjunto de componentes criado para trabalhar em conjunto com a tecnologia Atlas, implementando as funcionalidades do Atlas.

Para testar o que demonstramos neste artigo você precisará instalar o último CTP do Atlas, que você pode baixar aqui, bem como instalar també o Atlas control Toolkit, que você baixa aqui.

Pode também ser interessante ler nosso artigo anterior sobre o Atlas, no qual explicamos o funcionamento do UpdatePanel.

O UpdatePanel é uma forma fácil de fazer a aplicação do Atlas, evitando os postBacks. Porém as chamadas ao servidor ainda acontecem, mas em background, gerando o processamento completo da página a cada chamada. Em alguns casos isso pode ser suficiente, mas para outras situações podemos preferir evitar o processamento no servidor.

Para isso o Atlas control Toolkit trás vários webControls que, utilizando os recursos do Atlas, se comunicam com o servidor para buscar apenas a informação que desejamos, ao invés de provocar todo o processamento da página. Entre esses webControls temos a CascadingDropDown.

O objetivo deste webControl é permitir a montagem de DropDowns em cascata, ou seja, dropdowns com dados selecionados, onde o usuário seleciona uma informação na primeira dropDown para filtrar a 2a e assim por diante em um número indeterminado de vezes.

Começando o exemplo

Vamos então começar a montagem de um exemplo utilizando o banco Northwind. Vamos criar 2 combos relacionadas : Uma exibindo uma lista de paises nos quais a empresa possui clientes, outra exibindo os clientes de cada país.

O WebService precisa estar localizado no mesmo site que a página, não pode estar em um site diferente. Isso ocorre devido a segurança contra Cross-Site Scripting existente no browser, que impedirá um script de fazer a chamada para um webService em outro domínio.

Caso seja necessário que o webService esteja em outro domínio deve-se então utilizar o recurso de bridging do Atlas. Através deste recurso cria-se um webService em seu site que passa a funcionar como uma ponte de acesso a um webService em outro site, permitindo o uso dos componentes client do Atlas como a CascadingDropDownExtender. Neste artigo, porém, não abordaremos os recursos de bridging.

Nosso WebService precisa receber 2 parâmetros string e devolver um parâmetro de tipo especial, AtlasControlToolkit.CascadingDropDownNameValue, na verdade um array deste tipo . Trata-se de um elemento em par (nome/valor) fornecido pelo toolkit do Atlas.

Uma observação importante : No CTP testado, a cascadingDropDown se mostrou sensível aos nomes dos parâmetros. Portanto não basta que o webService tenha os mesmos tipos de parâmetros, mas os parâmetros deverão ter os mesmos nomes esperados pela cascadingDropDown.

Veja como fica a declaração do webService :

  113     <WebMethod()> _

  114     Public Function ListarClientes(ByVal knownCategoryValues As String, ByVal category As String) As AtlasControlToolkit.CascadingDropDownNameValue()

  115 

  116     End Function

Este único método do webService será o responsável por devolver as informações para todas as combos do conjunto de combos em cascata. Em nosso exemplo teremos uma combo de paises e uma combo de clientes, portanto este método deverá devolver ambas as informações, países e clientes, cada uma em seu momento adequado.

O parâmetro Category contém a informação que está sendo requisitada. Cada combo recebe um nome, uma identificação para a informação que ela representa. Por exemplo, em nosso caso a identificação das combos será "Paises" e "Clientes". Assim sendo, testando o parâmetro Category saberemos qual informação nosso webService deverá retornar.

Veja como fica o inicio da codificação do serviço :

  113     <WebMethod()> _

  114     Public Function ListarClientes(ByVal knownCategoryValues As String, ByVal category As String) As AtlasControlToolkit.CascadingDropDownNameValue()

  115 

  116         Select Case category

  117             Case "Paises"

  118 

  119             Case "Clientes"

  120         End Select

  121 

  122     End Function

A recuperação da lista de paises é bem simples, já que deverá sempre ser retornada de forma completa, sem nenhuma filtragem.

Veja como fica :

   49     <WebMethod()> _

   50     Public Function ListarClientes(ByVal knownCategoryValues As String, ByVal category As String) As AtlasControlToolkit.CascadingDropDownNameValue()

   51 

   52         Dim cn As New OleDbConnection

   53         Dim cmd As New OleDbCommand

   54         Dim dr As OleDbDataReader

   55 

   56         cn.ConnectionString = "Provider=SQLOLEDB;Data Source=.;User ID=sa;Initial Catalog=Northwind"

   57 

   58         cmd.Connection = cn

   59 

   60         Select Case category

   61             Case "Paises"

   62                 cmd.CommandText = "select distinct country from customers"

   63 

   64                 Dim lista As List(Of CascadingDropDownNameValue)

   65                 lista = New List(Of CascadingDropDownNameValue)

   66 

   67                 cn.Open()

   68 

   69                 dr = cmd.ExecuteReader

   70 

   71                 Do While dr.Read

   72                     lista.Add(New CascadingDropDownNameValue(dr("country"), dr("country")))

   73 

   74                 Loop

   75 

   76                 dr.Close()

   77                 cn.Close()

   78                 Return (lista.ToArray)

O próximo passo é a recuperação dos clientes. Neste caso, os clientes precisam ser filtrados de acordo com o valor do país selecionado. Para isso temos o parâmetro knownCategoryValues. Este parâmetro, do tipo string, contém os valores das combos anteriores a combo que está sendo solicitada. Por exemplo, no caso de estar sendo solicitada a combo Clientes o parâmetro knowCategoryValues contém o valor do país. Observe que podem existir inúmeros níveis de combos e este parâmetro terá o valor de todos os níveis.

Como você pode imaginar, o conteúdo desta variável fica concatenado em uma formatação própria da cascadingDropDown. Para decifra os valores contidos nesta variável devemos utilizar o método ParseKnownCategoryValuesString, que transforma esta variável string em um stringDictionary

Veja como isso fica :

   80                 Dim dic As StringDictionary

   81 

   82                 dic = CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues)

Com o stringDictionary em mãos, podemos ler dele os parâmetros que serão utilizados na query. Em nosso exemplo, apenas 1, o país.

Veja como fica o código completo de nosso serviço :

   49     <WebMethod()> _

   50     Public Function ListarClientes(ByVal knownCategoryValues As String, ByVal category As String) As AtlasControlToolkit.CascadingDropDownNameValue()

   51 

   52         Dim cn As New OleDbConnection

   53         Dim cmd As New OleDbCommand

   54         Dim dr As OleDbDataReader

   55 

   56         cn.ConnectionString = "Provider=SQLOLEDB;Data Source=.;User ID=sa;Initial Catalog=Northwind"

   57 

   58         cmd.Connection = cn

   59 

   60         Select Case category

   61             Case "Paises"

   62                 cmd.CommandText = "select distinct country from customers"

   63 

   64                 Dim lista As List(Of CascadingDropDownNameValue)

   65                 lista = New List(Of CascadingDropDownNameValue)

   66 

   67                 cn.Open()

   68 

   69                 dr = cmd.ExecuteReader

   70 

   71                 Do While dr.Read

   72                     lista.Add(New CascadingDropDownNameValue(dr("country"), dr("country")))

   73 

   74                 Loop

   75 

   76                 dr.Close()

   77                 cn.Close()

   78                 Return (lista.ToArray)

   79             Case "Clientes"

   80                 Dim dic As StringDictionary

   81 

   82                 dic = CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues)

   83 

   84                 If Not dic.ContainsKey("Paises") Then

   85                     Throw New Exception("Pais não encontrado")

   86                 End If

   87 

   88                 cmd.CommandText = "Select Customerid, CompanyName from customers where Country=?"

   89 

   90                 cmd.Parameters.Add(New OleDbParameter("Country", OleDbType.VarChar))

   91 

   92                 cmd.Parameters("Country").Value = dic("Paises")

   93 

   94                 Dim lista As List(Of CascadingDropDownNameValue)

   95                 lista = New List(Of CascadingDropDownNameValue)

   96 

   97                 cn.Open()

   98 

   99                 dr = cmd.ExecuteReader

  100 

  101                 Do While dr.Read

  102                     lista.Add(New CascadingDropDownNameValue(dr("CompanyName"), dr("CustomerID")))

  103 

  104                 Loop

  105 

  106                 dr.Close()

  107                 cn.Close()

  108                 Return (lista.ToArray)

  109 

  110         End Select

  111     End Function

Não tente testar o serviço diretamente, a página de testes não funciona devido ao tipo de dados de retorno.

O próximo passo é criarmos a página com nossas combos. Vamos inserir duas dropDownLists, vamos charmar uma de ddlPaises e a outra de ddlClientes. Por fim, adicionamos um CascadingDropDown.

O CascadingDropDown aparece como um webControl não visual e atua como um extender, adicionando propriedades para as dropDowns existentes.

Observando a janela de propriedades de uma das dropDownLists (qualquer uma), vemos propriedades a mais, que ficam agrupadas com o nome do extender, cascadingDropDown. Veja as propriedades que são adicionadas :

Category : Nome da categoria representada pela combo. Em nosso exemplo, "Paises" e "Clientes"
ParentControlID : Nome da combo "Pai". Na ddlClientes o parentControlID é ddlPaises.
PromptText : Texto de um item nulo que é inserido na combo. Por exemplo, "Selecione um pais".
ServiceMethod : Nome do método no serviço que será executado
ServicePath : Caminho até o serviço que será executado

Na ddlPaises teremos :

Category : Paises
ParentControlID : - não preenchido -
PromptText : Selecione o Pais
ServiceMethod : Listar Clientes
ServicePath : ~/Clientes.asmx

Na ddlClientes teremos :

Category : "Clientes"
ParentControlID : ddlPaises
PrompText : Selecione o Cliente
ServiceMethod : ListarClientes
ServicePath : ~/Clientes.asmx

No CTP que utilizei durante os testes, existe um pequeno detalhe nesta configuração : Como as propriedades da dllPaises não são completamente preenchidas (ParentControlID fica vazio), o VS não grava o que foi preenchido nas tags HTML e isso é perdido, fazendo com que a aplicação não funcione. Então pode ser necessário que você corrija as tags em meio ao HTML. Veja como elas ficam ao final :

<cc1:CascadingDropDown ID="CascadingDropDown1" runat="server">

<cc1:CascadingDropDownProperties Category="Paises" ClientStateFieldID=""
PromptText="Escolha um Pais" ServiceMethod="ListarClientes" ServicePath="Clientes.asmx"
TargetControlID="DropDownList1" />

<cc1:CascadingDropDownProperties Category="Clientes" ClientStateFieldID="" ParentControlID="DropDownList1"
PromptText="Escolha um Cliente" ServiceMethod="ListarClientes" ServicePath="Clientes.asmx"
TargetControlID="DropDownList2" />

</cc1:CascadingDropDown>

Essa demonstração foi realizada em um evento do grupo devASPNet e você encontra este código fonte no site do grupo no Yahoogrupos



Envie seus comentários sobre este artigo

Nome :

E-mail :

Comentários :


Avise-me quando houverem novos comentários nesta página

Veja abaixo os comentários já enviados :

Nome : Alerson E-Mail : alerson@gmail.com
Prezado Dennes

Fantástico o teu artigo. Parabéns

Mas estou tendo problemas na linha:
Dim lista As List(Of CascadingDropDownNameValue)
TYPE CascadingDropDownNameValue IS NOT DEFINED

Não querendo te encomodar, mas se vc tiver um tempinho poderia me dar alguma direção?

Eu consegui reproduzir o exemplo CascadingDropDown que vem no AtlasControlToolkit mas preciso uma solução para retirar os dados do SQL Server igual a sua.

Parabéns novamente

Alerson
Nome : Alerson E-Mail : alerson@gmail.com
Probleminha resolvido...

Imports System.Collections
Imports System.Collections.Generic
Nome : Leonardo E-Mail : lezanutto@yahoo.com.br
Tenho um site com cerca de 8 cascadingdropDown
consegui fazer todos funcionarem sem problemas.

meu problema está no PromptText se eu removo o PromptText
o cascading funcionam todos em sequencia mas nao Habilitam(ficam cinza)

Já tentei utilizar o SelectedValue sem nenhum sucesso
o que posso fazer já que nao quero Exibir o PromptText(quero que ja selecione o primeiro item da lista)???
Nome : Ademilso Peres E-Mail : ademilsoperes@uol.com.br
Estou tendo o erro "Error method 500"
alguem sabe o que é ?
Nome : Ronaldo E-Mail : ronaldo@rsmsolucoes.com.br
Dennes.

O cascadingdropdown somente funciona com webservice. Não consigo utilizá-lo no meu site apenas?
Obrigado.
P.S.: O artigo está ótimo, de fácil compreensão.