Hoje gostaria de falar e mostrar como funciona a junção do javascript, linguagem C#.NET e plataforma ASP.NET com Toolkit. Com o toolkit da Microsoft, alguns comandos como <script>alert(“aaa”);</script> dentro do código c# deixaram de funcionar.
Tag: Visual Studio 2010, Linguagem C#.NET, Plataforma ASP.NET.
O importante aqui é fazer funcionar o clique do botão para abrir uma tela modal, aquela que o usuário não consegue selecionar a tela de trás enquanto não fechar a primeira janela.
Como a plataforma é do tipo ASP.NET, ou seja, web é necessário fazer a junção de javascript e método c#.net. Dentro da tela .ASPX ou do arquivo .MASTER é necessário usar a função janelaModal. (Code 1)
|
<script type="text/javascript" language="javascript">
function janelaModal(url, nome, nrTamanho, nrLargura)
{
eval(window.showModalDialog(url, nome,'Resizable:no;DialogHeight:'+nrTamanho+'px; DialogWidth:'+nrLargura+'px; Edge:raised; Help:no; Scroll:no, Status:no; Center:yes;'));
}
</script>
|
Code 1
Note que o código javascript não é um bicho de sete cabeças. É necessário enviar o endereço da URL (pode ser apenas o nome da página ou se estiver dentro de uma pasta indique-a adicionando a barra e a página .aspx). É necessário enviar também o nome da tela, tamanho e largura.
Dentro da função, foi utilizado o comando showModalDialog definindo todos os parâmetros como nome, tamanho e largura. Podem ser definidos outros tipos como help, scroll, status e center; isso vai do seu critério.
O próximo passo é gerar o botão na tela e acionar o clique que tem responsabilidade de chamar a função javascript (Code 1).
Botão Vermelho ou Verde
Imagem 1
Note que na imagem 1, existem dois botões do tipo imagem. O nome técnico é IMAGE_BUTTON (um componente do próprio framework da Microsoft). Code 2.
|
<asp:ImageButton ID="imgButtonTela1" runat="server"
onclick="imgButtonTela1_Click" />
|
Code 2
Como na minha lógica de programação existe a possibilidade de ser uma bolinha verde ou vermelha, não coloquei o endereço da imagem ainda. Essa parte é feita no momento de execução. (Code 3)
|
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
verificaDados();
}
}
private void verificaDados()
{
bool _botaoVermelho = false;
logica();
if (_botaoVermelho)
imgButtonTela1.ImageUrl = "Sinais/botaovermelho.png";
else
imgButtonTela1.ImageUrl = "Sinais/botaoverde.png";
}
|
Code 3
No Load da página, chamo outro método que verifica os dados para mostrar a imagem vermelha ou verde. Lembrando que não mostrei a parte click do botão ainda, essa parte (code3) funciona apenas para mostrar a cor do botão.
Button Click
A parte do clique do botão é simples e fácil. A ferramenta gera o método de clique e agora basta colocar uma linha utilizando o scriptManager. (Code 4)
|
protected void imgButtonTela1_Click(object sender, ImageClickEventArgs
e)
{
ScriptManager.RegisterClientScriptBlock(this, this.GetType(),
"NomedaJanela", "janelaModal('pagina.aspx','Sua','680','1020')",
true);
}
|
Code 4
O ScriptManager.RegisterClientScriptBlock funciona mesmo que esteja utilizando o Toolkit da Microsoft, isto é, mesmo que tenha todos aqueles componentes da dll AjaxControlToolkit funciona. Explico isso porque os comandos <script> dentro do código c#.net deixaram de funcionar quando se usa o AjaxToolkit.
O comando dentro do método chama a função criada anteriormente (Code 1) “janelaModal” passando os parâmetros esperados pelo método.
Como eu gosto de mostrar o resultado final de todo trabalho feito até agora, segue uma imagem. (Imagem 2). Eu não posso mostrar o que tem na tela, mas posso mostrar que a tela abriu de forma modal.
