Quem já não sentiu a necessidade de exibir ou ocultar painéis de pesquisa em uma aplicação asp.net? Uma solução interessante seria a utilização da propriedade Visible, definindo-a como True ou False de acordo com a necessidade, mas com desvantagens, pode ser apenas aplicado a componentes da VCL (runatserver) e é muito demorado, pelo fato que toda vez que uma manipulação necessita ser feita, toda a página é recarregada.
Uma das soluções para otimizar a situação é a utilização de blocos javascript integrados com os componentes da aplicação Delphi for asp.net. No RAD 2007 vamos criar uma nova asp.net application e simular um formulário de pesquisa, com possibilidade de filtrar por um período de dados, filtro este que se tornará visível a partir da seleção de um componente CheckBox.
Adicione ao formulário um componente CheckBox(ckFiltrar) da paleta Web Controls, da paleta HTML Elements arraste um componente HTML Flow Panel (Painel) que na verdade trata-se de uma div HTML e dentro da mesma adicione os textos “Data Inicial:” e “Data Final” seguido de dois componentes TextBox. Por último, logo abaixo a div, adicione um componente Button que irá simular a aplicação do filtro.
Iniciando pela criação dos blocos de javascript, vá até a página de código aspx e posicionando-se no head da página, adicione as seguintes funções javascript:
<head runat="server">
<title></title>
<script>
function FecharFiltro()
{
document.getElementById("Painel").style.
visibility="hidden";
}
function Filtro()
{
if (document.getElementById("ckFiltrar").
checked == true)
{
document.getElementById("Painel").style.
visibility="visible";
}
if (document.getElementById("ckFiltrar").
checked == false)
{
document.getElementById("Painel").style.
visibility="hidden";
}
}
</script>
</head>
Estas funções são responsáveis por manipular a visibilidade do painel de pesquisa, seja no momento em que a página for carregada ou seja na seleção do componente ckFiltrar onde utilizamos o if para verificar se o mesmo está marcado ou não.
Por último, precisamos vincular o código a página e ao componente ckFiltrar, vinculo este que será realizado no evento Load da página. Acessando o evento, digite as seguintes linhas de código:
ClientScript.RegisterStartupScript(GetType,
'OnLoad','<script>javascript:
FecharFiltro();</script>');
ckFiltrar.Attributes.Add('onClick',
'javascript:Filtro();');
Neste código, na primeira linha definimos que toda vez que a página for recarregada, a função javascript “FecharFiltro” será executada, ocultando o painel de pesquisa. Na segunda linha, atribuímos ao evento onClick do ckFiltrar a função “Filtro”, que fará a manipulação de visibilidade do painel de pesquisa.
Executando a aplicação, ao marcar e desmarcar o componente observe que o painel será exibido ou ocultado de acordo com a opção. Se estiver marcado, o painel estará visível.
Dessa mesma forma, poderá implementar mais funcionalidades em outros componentes utilizando javascript ou criar novos blocos de códigos. Até a próxima.
Nenhum comentário:
Postar um comentário