DataList: Customizando - Parte 2

Continuando com nosso artigo...

Abra a SmartTag do DataList e clique na opção Edit Template. São essas as informações que veremos no DataList quando o projeto for compilado.

Logo abaixo dessas informações, adicione um HyperLink, dando o nome de Produtos da Categoria para a propriedade Text:

Perceba que posso ir na propriedade NavigateURL e escolher a página DadosDataList.aspx, mais se eu fizer isso, esta página será aberta em branco, já que o GridView da mesma foi passado usando aquele filtro de parametrização, onde uso a QueryString para passar o ID da Categoria.

Então como irei fazer esta parametrização? Simples, aperte F7 para ir à página de códigos da Default.aspx e crie o seguinte método:

protected string GetID(int CategoryID)

        {

            return "DadosDataList.aspx?CategoryID=" + CategoryID.ToString();

        }

No código acima criamos um método do tipo string que tem como parâmetro um inteiro representando o ID da Categoria, dentro do método ele retorna a url da DadosDataList, concatenado com o parâmetro declarado na assinatura do método. Assim, em cada HyperLink que for clicado no DataList (lembrando que cada um é referente a um ID de uma Categoria), irá popular o GridView com os produtos relacionados à este ID.

Volte ao modo Design, vá novamente ao EditTemplate do DataList, abra a SmartTag do HyperLink e clique no EditDataBindings, que é o local onde nós configuramos as informações provenientes de uma fonte de dados, nesse caso será configurado nosso método recém-criado.

Escolha a opção NavigateUrl, à esquerda, o Custom binding à direita e no Code expression, adicione o seguinte código:

O que fizemos acima foi passar nosso método GetID, fazendo a conversão, já que o Code expression retorna um objeto e o parâmetro de nosso método contém um inteiro, passando dentro de Eval, o valor CategoryID.

Agora clique na SmartTag do GridView e clique em End Template Editing, para voltarmos ao nosso GridView com todas as colunas.

Antes de compilar, clique na aba Source, da Default.aspx e perceba que este código que adicionamos pelo DataBindings do Image, pode ser adicionado diretamente no aspx:

OBS: Eval é a expressão usada pelo ASP.NET que irá mostrar o dado em tela.

Salve o projeto e aperte F5 para compilarmos, irá aparecer uma mensagem para que seja alterado as configurações do Web.Config e a compilação possa ocorrer. Clique em OK e aguarde.

Passe o mouse sobre o HyperLink da Categoria 7 por exemplo e perceba abaixo que a URL exibida é a página DadosDataList concatenada com o parâmetro que passamos em nosso método, que é o ID da Categoria selecionada:

Ao clicarmos no HyperLink, é exibido o GridView populado com todos os Produtos desta Categoria:

Assim finalizo o artigo.

O conceito deste artigo é bem parecido com os últimos artigos publicados recentemente, como o Imagens no GridView, só mudam poucos detalhes.

Para quem se interessar, disponibilizo o código fonte desse projeto aqui.

 Até o próximo artigo!