Olá amigos, vou colocar hoje um exemplo simples de como se trabalhar com as colunas TEMPLATE em uma GridView.

GridView é um controle  muito interessante e deve ser estudado a fundo.

Uma forma interessante de se trabalhar com gridview no ASP.NET é a utilização de TEMPLATES, vamos ver abaixo como funciona na prática.

1. Abra o Visual Studio e crie um novo WebSite (File >> New WebSite)




2. Inclua na Página Default.aspx um GridView diretamente da ToolBox.



3. Clique na SmartTag da GridView e selecione a opção “Edit Columns”


4. Desmarque a opção “Auto-Generate Fields” ( ela cria os campos de forma automatica de acordo com os dados inseridos no gridview)


5. Na Lista Available Fields, seleciono o TemplateField e cliqueem ADD.



6. Na propriedade HeaderText insira o nome do cabeçalho, como vamos trabalhar com o NorthWind e a tabela Customers vamos inserir o texto “Customers”. e clique em OK.

7. Vai perceber que a grid agora possue uma coluna apenas com o cabeçalho “Customers”, leve o moues até o cabeçalho e note que este vai
virar uma cruz branca, clique com o botão direito, clique na opção Edit Template >> Column[0] Customers.


8. a GridView aparece agora com várias opções como ItemTemplate, AlternatingItemTemplate, EditItemTemplate, HeaderTemplate, FooterTemplate.



10. Clique na SmartTag >> End Template Editing



11. Va até o código da página ASP.NET e encontre a frase Customer:Customers e troque para Customer:, ou seja a palavra “Customers”
após “:” foi utilizada para referência no código da página. o valor será atribuído pela tag .

12.Clique na SmartTag >> Chhose DataSource >>




9. na Caixa ItemTemplate digite conforme abaixo:


13. Selecione a opção SQl Server. Insira as Informações de SERVER e se a autenticação no fore pelo Windows Insira os dados de Usuário e Senha.

Defina o Banco NorthWind e clique em NEXT.





14. Selecione a tabela Customers. e os campos “CompanyName” e “City”. Clique em Next até Finalizar.

Rode a aplicação e veja o Resultado.

Entenda que a partir desta opção voce pode acrescentar link, link com imagens, além do que voce pode também mudar o estilo CSS de cada linha,

Boa sorte e Feliz ano Novo!!!