trabalhando com updatepanel no asp

22/01/2015 TrabalhandocomUpdatePanelnoASP.NETiMasters

http://imasters.com.br/framework/dotnet/trabalhandocomupdatepanelnoaspnet/ 1/7

/DESIGN /DESENVOLVIMENTO /BANCODEDADOS /MARKETINGDIGITAL Facebook Twitter

Porta l FrunsiMasters Ciclo7Masters RevistaiMasters Ferramentas Cursosonl ine Agenda InterCon UXWeekend

TrabalhandocomUpdatePanelnoASP.NET

WagnerLeonardiem.NET

Ol! Hoje vou apresentar algumas funcionalidades avanadas do

UpdatePanel do ASP.NET. recomendado que voc tenha o

conhecimento bsico do UpdatePanel e sobre PostBack para tal.

A funo bsica do UpdatePanel atualizar seu contedo sem provocar

um PostBack completo (o que provocaria o recarregamento da pgina,

perdendo possveis dados inseridos e modificados pelo o usurio). A

atualizao do contedo dentro do UpdatePanel se chama PostBack

parcial: assim que um controle dentro do UpdatePanel dispara um

evento, gerado um PostBack que aps executado no recarrega a

pgina; apenas atualiza o contedo dentro do UpdatePanel.

Essa tecnologia j antiga, e se chama AJAX (utilizando Javascript), mas

o controle UpdatePanel faz tudo isso sozinho e no devemos nos

preocupar com isso agora. O que irei abordar so funcionalidades do

UpdatePanel que muitos usurios j experientes desconhecem, e pode

aumentar incrivelmente a performance e a produtividade da sua

aplicao. Vamos l!

Propriedade UpdateModeA propriedade UpdateMode define o modo de como o contedo dentro

do UpdatePanel vai ser atualizado, e ela pode receber os seguintes

valores:



Propriedade ChildrenAsTriggersA propriedade ChildrenAsTriggers (traduo: Filhos como

Disparadores/Gatilhos) serve para definir se todos os eventos dos

controles filhos (controles dentro do UpdatePanel) sero gerenciados pelo

UpdatePanel. Ela recebe o valor true para que isso ocorra, ou false

para que isso seja desativado e voc faa o controle manualmente

atravs da seo Triggers, que veremos logo em seguida. Caso voc no

especifique, o UpdatePanel utiliza o valor true como padro.

Para utilizar o valor false obrigatrio utilizar a propriedade

UpdateMode=false no UpdatePanel.

TriggersQuando voc insere componentes dentro de um UpdatePanel j deve ter

percebido que no faz isso logo em seguida da tag ; voc cria antes a

tag , que serve para que voc coloque todo o contedo que ser visvel

para o usurio, e que o UpdatePanel ir gerenciar.

Alem de ContentTemplate, o UpdatePanel possui a tag Triggers. Dentro

dessa tag voc poder informar quais controles (e tambm especificar os

eventos dos controles) que podero provocar um PostBack. Voc pode

inserir dois tipos de Triggers:

Always: (traduo: Sempre), define que o contedo dentro doUpdatePanel sempre ser atualizado aps a execuo de um PostBackgerado por qualquer componente na pgina, inclusive por outroUpdatePanel. o modo padro do UpdatePanel caso voc noespecifique.

Conditional: (traduo: Condicional), nesse modo o UpdatePanel s atualizado caso o PostBack for gerado por um componente dentro dele,caso voc queira atualizar um UpdatePanel no modo conditional vocdeve fazer manualmente utilizando o mtodo Update() do UpdatePanel.(Obs.: no permitido utilizar o mtodo Update() no modo Always, etambm no seria necessrio!).

PostBackTrigger: Ir provocar o PostBack completo, recarregando apgina inteira;

AsyncPostBackTrigger: Ir provocar o PostBack parcial, sem recarregar apgina.



Uma grande vantagem de utilizar Triggers, poder utilizar um boto fora

do UpdatePanel para atualizar o UpdatePanel, sem recarregar a pgina!

Agora vamos ver tudo isso na prtica!

Default.aspx

Default.aspx.cs

1 2 3



ResultadosAo clicar no boto Atualizar Painis:

Ao clicar no boto Atualizar Pgina:

Ao clicar no boto Painel 1:


22 protectedvoidPainel3_Click(objectsender,EventArgse)23 {24 txtPainel1.Text="Painel3quematualizou";25 txtPainel2.Text="Painel3quematualizou";26 txtPainel3.Text="Painel3quematualizou";27 28 updPainel1.Update();29 }

Painel 1: atualizado, pois est como UpdateModel=Conditional e oboto que gerou o PostBack um Trigger dele;

Painel 2: no atualizado, pois est como UpdateModel=Conditional eo PostBack foi gerado por um componente fora dele;

Painel 3: atualizado, porque por padro est definidocomo UpdateModel=Always.

Como o Trigger desse boto do tipo PostBackTrigger, a pgina recarregada completamente, atualizando todos os painis.

Painel 1: est com a propriedade ChildrenAsTriggers=false, entomesmo que o boto esteja dentro dele, seu contedo no atualizadoporque o ele no est definido como um Trigger em;

Painel 2: no atualizado, pois est definidocomo UpdateModel=Conditional e o PostBack foi gerado por umcomponente fora dele;

Painel 3: atualizado, porque por padro est comUpdateModel=Always.


Painel 2: atualizado, pois est definidocomo UpdateModel=Conditional mas o PostBack foi gerado por umcomponente dentro dele;




ConclusoUm problema comum quando queremos que apenas o UpdatePanel

seja atualizado, mas a pgina carregada completamente. Quando isso

ocorrer, possivelmente usar Triggers manualmente pode resolver o seu

problema. A minha dica sempre que voc tiver um UpdatePanel com

muitos controles, ou at mesmo em uma pgina complexa,

utilizar Triggers , UpdateModel=Conditional eChildrenAsTriggers=false para poder ter um controle total dofuncionamento do seu UpdatePanel, mas se voc estiver fazendo algo

simples, no perca tempo com isso.

Apesar do UpdatePanel ser uma ferramenta fantstica, existe alguns

(poucos) casos em que ele no se comporta bem em tarefas mais

complexas, e nem sempre ele vai poder resolver a sua vida, ento no

deixe de aprender a tecnologia AJAX em Javascript, que a forma que o

UpdatePanel trabalha por tras dos bastidores.

Por hoje s , espero que voc tenha executado o cdigo e percebido

como o UpdatePanel pode se comportar de maneiras bem diferentes, e

que podem aumentar significamente a performance e a produtividade da

sua aplicao.


Painel 1: atualizado, porque o mtodo Painel3_Click chamamanualmente a funo updPainel1.Update();



0 0 0 Compartilhar Tweetar Google+



WagnerLeonardidesenvolvedordeaplicaesparaweb,especialistanaslinguagensASP.NETC#,

JavaePHP.

VB.NETCriandoumprojetoparadistribuiocomoCrystalReports

JosCarlosMacorattiem.NET

Comentrios

ParacomentarnoiMastersvocprecisaestarlogado.OiMasterspossuimaisde13miltextospublicados,em13anosjsomosumacomunidadedemais350milpessoas.CadastreseagoramesmoGRATUITAMENTEetenhaacessoatodoomundoiMasters.

J tenho conta Quero me cadastrar

leiaagora

.NETchato

Responderronaldo

16deabrilde2013s9:54

Gostariadesaberaaplicaoprtica.Tenhoumsitede



anunciosdeEventos.Ondepossocolocarissoemelhorarmeusite?Temumexemplodefuncionamentoprtico?

Responderalexandredacota



OlAlexandre!AaplicaodoUpdatePanelsimplesmentealterarumcontedodeumapginajcarregada,semprecisarcarregarapginanovamente,oquedeixaanavegaodousuriomaisrpidaesuave.Entocoloqueoondequeiraqueseusitetenhaessecomportamento.UmexemploprticoterumUpdatePanelemumalistadeusurioseumformulriodecadastroembaixodessalista,equandovoccadastrarumnovousurionoformulrio,vocejmostranalistaessenovousuriosemprecisarcarregarnovamente.Basicamentenotemlimites,vocpodefazeroquevocquisermesmo!

WagnerLeonardi

BomdiaWagner.comoseriapossvelpegaroeventodeumdropDowndessaforma?

timoartigo,parabns.

Responder

Tiago7denovembrode2013s

10:10

DesenvolvimentoAgileAjaxAnlisedeDadosCakePHPCSSFrontEndHTMLJavaJavaScriptPHPPythonRuby

Design3dsmaxAcessibilidadeArquiteturadeInformaoDesignResponsivoGamesUsabilidadeUserExperience

BancodedadosInterbaseMongoDBMySQLOraclePostgreSQLSQLServer

InfraeCloudCloudComputingLinuxMicrosoftAzureSeguranaSiteBlindado

MarketingDigitalContedoDigitalEcommerceEmailMarketingMercadoPublicidadeOnlineRedesSociaisTendncias

MobileAndroidiPhone&iPad

Agenda

Frum

7Masters

CursosOnline

InterCon

RevistaiMasters

SobreoiMasters PolticadePrivacidade Faleconosco iMastersExpert(englishblog) Twitter Facebook Google Plus LinkedIn

Este projeto mantido e patrocinado pelas empresas:

trabalhando com updatepanel no asp

Documents