AJAX significa JavaScript e XML assíncronos. Esta é uma tecnologia multiplataforma que acelera os tempos de resposta. Os controles do servidor AJAX adicionam script à página, que é executado e processado pelo navegador.
No entanto, como outros controles de servidor ASP.NET, esses controles de servidor AJAX podem ter métodos e manipuladores de eventos associados a eles, que são todos manipulados no lado do servidor.
A caixa de ferramentas de controle no IDE do Visual Studio contém um conjunto de componentes de controle chamado 'AJAX'.
O controle ScriptManager é o controle mais importante e deve estar presente na página para que outros controles funcionem.
Possui sintaxe básica:
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
Se você criar um 'site habilitado para Ajax' ou adicionar um 'formulário da Web AJAX' na caixa de diálogo 'Adicionar item', a página da Web será formada automaticamente e conterá o controle do gerenciador de script. O controle ScriptManager cuida dos scripts do lado do cliente para todos os controles do lado do servidor.
O controle UpdatePanel é um controle de contêiner e é derivado da classe Control. Ele opera como um contêiner para os controles filhos dentro dele e não possui interface própria. Quando um de seus controles aciona um envio de volta, o UpdatePanel intervém para iniciar de forma assíncrona e atualizar parte da página.
Por exemplo, se um controle de botão estiver dentro de um painel de atualização e for clicado, apenas os controles no painel de atualização serão afetados e os controles em outras partes da página não serão afetados. Isso é chamado de retorno de confirmação parcial ou retorno de confirmação assíncrona.
Adicione um formulário web AJAX ao seu aplicativo. Ele contém o controle do gerenciador de script padrão. Insira um painel de atualização. Coloque um controle de botão e um rótulo dentro do controle do painel de atualização. Coloque outro conjunto de botões e rótulos fora do painel.
A visualização do design é semelhante a esta:
O arquivo de recurso se parece com isto:
<form id="form1" runat="server"> <div> <asp:ScriptManager ID="ScriptManager1" runat="server" /> </div> <asp:UpdatePanel ID="UpdatePanel1" runat="server" > <ContentTemplate> <asp:Button ID="btnpartial" runat="server" onclick="btnpartial_Click" Text="Partial PostBack"/> <br /> <br /> <asp:Label ID="lblpartial" runat="server"></asp:Label> </ContentTemplate> </asp:UpdatePanel> <p> </p> <p>Fora do painel de atualização</p> < p> <asp:Button ID="btntotal" runat="server" onclick="btntotal_Click" Text="Total PostBack" /> </p> <asp:Label ID="lbltotal" runat="servidor"></asp:Label></form>
Todos os controles do botão têm o mesmo código para o manipulador de tempo:
string time = DateTime.Now.ToLongTimeString();lblpartial.Text = "Mostrando hora do painel" + time;lbltotal.Text = "Mostrando hora de fora" + time;
Observe que quando a página for executada, se o botão de retorno de submit total for clicado, ele irá atualizar todas as tags com o tempo de atualização, mas se o botão de retorno de submit parcial for clicado, ele atualizará apenas as tags do painel de atualização.
| propriedade | descrever |
|---|---|
| CriançasAsTriggers | Esta propriedade indica se o retorno vem de um controle filho, o que fará com que o painel de atualização seja atualizado. |
| Modelo de conteúdo | É o modelo de conteúdo e define o que aparece no painel de atualização quando ele aparece. |
| ContentTemplateContainer | Recupera um objeto contêiner de modelo criado dinamicamente e é usado para adicionar controles filho programaticamente. |
| IsInPartialRendering | Indica se o painel é atualizado como parte do retorno de confirmação parcial. |
| Modo de renderização | Mostrar modo de renderização. Os modos disponíveis são Block e Inline. |
| Modo de atualização | Obtém ou define o modo de renderização determinando algumas condições. |
| Gatilhos | Defina objetos disparadores de coleção, cada um correspondendo a um evento que dispara a atualização automática do painel. |
A tabela a seguir mostra os métodos de controle do painel de atualização:
| método | descrever |
|---|---|
| CreateContentTemplateContainer | Um objeto Control é criado para servir como um contêiner para os controles filho que definem o conteúdo do controle UpdatePanel. |
| CriarControlCollection | Retorna uma coleção de todos os controles contidos no controle UpdatePanel |
| Inicializar | Inicializa a coleção de gatilhos de controle UpdatePanel se o desenho parcial da página estiver em execução. |
| Atualizar | Faz com que o conteúdo do controle UpdatePanel seja atualizado. |
O comportamento do painel de atualização depende dos valores da propriedade UpdateMode e da propriedade ChildrenAsTriggers.
| método | descrever | Influência |
|---|---|---|
| Sempre | Falso | Parâmetro ilegal. |
| Sempre | Verdadeiro | O UpdatePanel é atualizado se a página inteira for atualizada ou um controle filho acima dela retornar. |
| Condicional | Falso | O UpdatePanel é atualizado se a página inteira for atualizada ou se um controle acionado fora dela iniciar uma atualização. |
| Condicional | Verdadeiro | O UpdatePanel é atualizado se a página inteira for atualizada ou um controle filho acima dela retornar ou um controle de acionamento fora dela iniciar uma atualização. |
O controle UpdateProgress fornece feedback do navegador quando um ou mais controles do painel de atualização são atualizados. Por exemplo, aguardar uma resposta do servidor quando um usuário fizer login ou ao realizar algum trabalho orientado ao banco de dados.
Fornece confirmação visual, como "Carregando página...", de que o trabalho está sendo processado.
A sintaxe do controle UpdateProgress é:
<asp:UpdateProgress ID="UpdateProgress1" runat="server" DynamicLayout="true" AssociatedUpdatePanelID="UpdatePanel1" > <ProgressTemplate> Carregando... </ProgressTemplate></asp:UpdateProgress>
O trecho acima mostra uma mensagem simples com uma tag ProgressTemplate. No entanto, pode ser uma imagem ou outro controle relacionado. O controle UpdateProgress exibe cada retorno assíncrono, a menos que seja especificado como um painel de atualização separado usando a propriedade AssociatedUpdatePanelID.
A tabela a seguir mostra as propriedades do controle de progresso da atualização.
| propriedade | descrever |
|---|---|
| AssociatedUpdatePanelID | Obtém e define a ID do painel de atualização com o controle ao qual esse controle está associado. |
| Atributos | Obtém e define a propriedade CSS (folha de estilo em cascata) do controle UpdateProgress. |
| Exibir depois | Obtém e define o tempo em milissegundos após a exibição do modelo de processamento. O padrão é 500. |
| Layout Dinâmico | Indica se os modelos de processo são exibidos dinamicamente. |
| Modelo de Progresso | Indica que o modelo é exibido durante um retorno de confirmação assíncrono que leva mais tempo que o tempo DisplayAfter. |
A tabela a seguir mostra os métodos de controle de progresso da atualização:
| método | descrever |
|---|---|
| GetScriptDescriptores | Retorna uma lista de componentes, comportamentos e controles do lado do cliente necessários para a funcionalidade do lado do cliente do controle UpdateProgress. |
| Referências GetScript | Retorna uma lista de controles UpdateProgress dos quais os scripts do cliente dependem. |
O controle do temporizador é usado para inicializar automaticamente os retornos de envio. Isso pode ser feito de duas maneiras:
(1) Defina a propriedade Triggers do controle UpdatePanel.
<Triggers> <asp:AsyncPostBackTrigger ControlID="btnpanel2" EventName="Click" /></Triggers>
(2) Coloque um controle de timer diretamente dentro do UpdatePanel como um gatilho para um subcontrole. Um único temporizador pode servir como gatilho para muitos UpdatePanels.
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always"> <ContentTemplate> <asp:Timer ID="Timer1" runat="server" Interval="1000"> </asp:Timer> < asp:Label ID="Label1" runat="server" Height="101px" > </asp:Label> </ContentTemplate></asp:UpdatePanel>