Trabalhando com LinkButton dentro do Gridview
Olá pessoal, gostaria de explicar passo a passo como trabalhar com componente LinkButton dentro do GridView de forma dinâmica e simples. É preciso ficar atento em alguns detalhes especiais.
Requisito:
Ferramenta: Visual Studio.NET 2008
Linguagem: C#.NET
Conhecimento dos componentes .NET
Explicando a situação
Tenho um aplicativo utilizando AJAX e tenho um grid sendo exibido na página. Dentro desse grid, tenho um link que devo clicar para abrir um outro componente .NET chamado TabContainer – segue um link de um artigo mostrando o TabContainer. [http://aspneti.com/trabalhando+com+o+componente+tabcontainer+722,0.aspx].
Se eu colocar um link na página normalmente; isto é; <a href=””>, a tela dará refresh em tudo e na verdade quero apenas abrir um componente específico passando parâmetro do grid preenchido. Fora que, não quero mostrar na página o parâmetro que está sendo passado, dessa forma fica mais seguro. Melhor fazer tudo internamente. Espero que tenha entendido um pouco a explicação, tentei ser mais claro possível.
Código GridView
Segue o código gridview montado. (Code 1.1)
<asp:GridView ID="grdProntuario"
runat="server" Width="170px"
AutoGenerateColumns="false" ShowHeader="false">
<Columns>
<asp:TemplateField> <ItemTemplate> <asp:Image ID="imgProntuario"
runat="server"
ImageUrl="~/App_Themes/default/image/cadeado.png"
/> </ItemTemplate> </asp:TemplateField>
<asp:BoundField DataField="Bloqueado"
ItemStyle-ForeColor="White"/> <asp:BoundField DataField="DocumentoCapturadoId" ItemStyle-ForeColor="White"/>
</Columns> </asp:GridView> |
Code 1.1
O code 1.1 mostra apenas o código do gridview sem maiores detalhes. Uma observação é que coloquei uma imagem (<asp:image>) no itemTemplate do gridview. Dentro desse itemTemplate, vou colocar mais um componente chamado LinkButton. Code 1.2.
<asp:GridView ID="grdProntuario"
runat="server"
Width="170px"
AutoGenerateColumns="false" ShowHeader="false"
onrowdatabound="grdProntuario_RowDataBound">
<Columns>
<asp:TemplateField> <ItemTemplate> <asp:Image ID="imgProntuario"
runat="server"
ImageUrl="~/App_Themes/default/image/cadeado.png"
/> <asp:LinkButton ID="lnkProntuario"
runat="server"
Text='<%# DataBinder.Eval(Container.DataItem, "Campo1")
%>' oncommand="lnkProntuario_Command"
CommandArgument='<%# (String)
DataBinder.Eval(Container.DataItem, "Campo1") + "$" +
DataBinder.Eval(Container.DataItem, "Campo2") %>'> </asp:LinkButton> </ItemTemplate> </asp:TemplateField>
<asp:BoundField DataField="Bloqueado"
ItemStyle-ForeColor="White"/>
<asp:BoundField DataField="DocumentoCapturadoId"
ItemStyle-ForeColor="White"/>
</Columns> </asp:GridView> |
Code 1.2
Note
que depois da imagem adicionei o código (<asp:LinkButton ID="lnkProntuario" runat="server" Text='<%#
DataBinder.Eval(Container.DataItem, "Campo1") %>' oncommand="lnkProntuario_Command"
CommandArgument='<%# (String) DataBinder.Eval(Container.DataItem,
"Campo1") + "$" + DataBinder.Eval(Container.DataItem,
"Campo2") %>'></asp:LinkButton>)
e depois desse código continuei o gridview com seus campos específicos.
Explicação:
O que aparece no Text do componente <LinkButton> é o “Campo1” vindo da pesquisa no banco de dados. Para editar o grid, tive que clicar com o botão direito, acessar as propriedades do gridview e depois acessar o linkButton. (Imagem 1.1)
Referência: 1.1
Como mostro na referência, cliquei com o botão direito em cima do gridview; escolhi a opção Edit Template e escolhi a coluna número [0]. Automaticamente o linkbutton apareceu para ser editado. (Referência 1.2)
Referência: 1.2
No itemTemplate aberto, cliquei em cima selecionando o componente e acessar as suas propriedades. Foi exatamente isso que fiz. O evento ativado foi o onCommand. (Referência 1.3)
Referência: 1.3
Quando eu ativo o onCommand, posso passar os parâmetros como argumento usando a propriedade CommandArgument. Os parâmetros de envio vieram também do banco de dados como campos normais do dataset. (Code 1.3)
CommandArgument='<%# (String) DataBinder.Eval(Container.DataItem, "Campo1")
+ "$" + DataBinder.Eval(Container.DataItem, "Campo2") %>'> |
Code 1.3
No meu caso eu preciso passar dois campos ao mesmo tempo para o meu código, e com o linkbutton, eu tive que passar como valor e depois separa com o Split. Veja que coloquei (String) antes dos dois valores para informar que os dados são do tipo string. O próximo passo é explicar e mostrar o código C#.NET. Code 1.4
protected void
lnkProntuario_Command(object sender, CommandEventArgs e) { try { string[] cmdArgs =
e.CommandArgument.ToString().Split(new char[] { '$' }); Texto1.Text
= cmdArgs[0].ToString(); Texto2.Text
= cmdArgs[1].ToString(); } catch
(Exception ex) { throw
ex; } } |
Code 1.4
Vendo um pouco sobre o lnkProntuario_Command, declarei um array de string[] pegando o e.CommandArgument.ToString().Split(new char[]{‘$’}). O e.CommandArgument é o valor vindo do grid quando clico no linkButton, porém vem tudo junto, por exemplo: MeuNome$123456.
Preciso agora separar a string concatenada pelo $ (cifrão). Com o split para separar as duas strings entre o $, fiquei com a posição zero e posição 1 para exibir no componente TabContainer falado anteriormente.
Para esse final, basta separar a posição 0 para um tempo e a posição 1 para outro campo.
Comando para pegar no momento clicado. Code 1.5
e.CommandArgument.ToString(). |
Code 1.5
Comando para separar a string concatenada. Code 1.6
string[] cmdArgs =
e.CommandArgument.ToString().Split(new char[] { '$' }); |
Code 1.6
Comando para pegar a primeira e segunda posição do array de string. Code 1.7
Texto1.Text = cmdArgs[0].ToString(); Texto2.Text = cmdArgs[1].ToString(); |
Code 1.7
Bom, eu fico por aqui, espero ter ajudado e esclarecido a você leitor, como desenvolver com linkButton dentro do gridview.
Sign up to our newsletter
Receive our latest updates about programming languages, software, database, books, ebooks, classes, jobs and more.