Robson Alves O que torna um sonho irrealizável é a inércia de quem sonha

PageRequestManager

Utilizando WebForms, tenho sempre em mente a vontade de melhor o desempenho das páginas e evitar ao máximo as requisições Server-Side. Como vejo muito acontecer, muitas vezes preciso alterar uma mascará de um campo e para isso é feito um postback em toda o Form, apenas com o único objetivo de alterar o campo em questão.

Isto é funcional, mas temos melhores formas de se fazer isto sem a utilização server-side, e só podemos falar em Jquery!

O Nosso cenário

Para que esta funcionalidade tenha efeito nós devemos utilizar nas páginas o updatepanel do AJAX.

Um botão do asp.net, com a função Click.

um script de jquery que altere informações dos campos da tela e meche com qualquer outro objeto.

Obs: Necessita do Jquery e do Plugin Mask que estou disponibilizando no blog.

O que Ocorre

Imagine que fizemos a utilização do .Mask do Jquery, incluimos um valor e clicamos no botão de pesquisar, o postback do button faz com que a mascara deixe de existir e com ele as informações.

O postback criado pelo button do asp.net grava as informações do seus objetos em uma viewstate e recupera ela ao recarregar a página, entretanto as mascaras do Jquery não são armazenadas, elas devem ser recriadas em todo novo estado da página.

 

O PageRequestManager

Este gerenciador controla as atualizações do modo PartialPage que são realizadas dentro de um container do updatepanel.

Eles nos possibilita gerenciar os seguintes status:

• beginRequest
• pageLoading
• pageLoaded
• endRequest

Segue referência para enteder maiores detalhes de cada um: http://msdn.microsoft.com/pt-br/library/bb311028.aspx

Neste caso utilizaremos o endRequest, pois com ele conseguiremos resolver o problema de perca das informações que o Jquery havia posto anterior ao postback.

Utilizando o EndRequest

O que deve ser feito neste caso, vamos colocar no final da nova requisição (postback) assincrono e verificar o estado atual da página, você irá notar no código fonte abaixo, que a funciont EndRequest é bem maior que sua original, devido eu pegar o valor do DropDownList e verificar seu change, com o EndRequest o valor do DropDownList não foi alterado e assim o Jquery não entra na função Change e consequentemente não atribui nenhuma máscara ao campo.

Para pegarmos o momento em que o status da página estiver sendo realizado podemos utilizar os seguintes comandos:

Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(Function());
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(Function());
Sys.WebForms.PageRequestManager.getInstance().add_pageLoading(Function());
Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(Function());

 

Cada um desse atende a um status da página.

Chega de Falácia, Go Code:

Código

 

Assim mesmo com o postback realizado pelo asp.net nós conseguimos manter o estado do Jquery em todos os objetos que ele estiver atribuido.

É válido neste código alterar o endRequest por pageLoaded.

 

Obrigado.

Posts Relacionados:

1. Jquery e C#–WebMethods
   Uma funcionalidade bem legal do Jquery em conjunto com o C#, estão nas possibilidade de chamadas assincronas, melhor ainda quando podemos acessar código C#. Primeiramente vamos montar o script Jquery, ele pode estar dentro de um arquivo JS na solution...