Utilizando Ajax com Delphi 2005 (ASP.Net)

Este artigo foi publicado na edição 25 da revista Active Delphi.
Para assinar a revista, clique aqui.

Esta edição publicou os seguintes artigos:

Herança e Método de Classe
Log com ClientDataSet
Tipos blobs com BDE e IBX em Firebird
TMedia - Componente
Utilizando Ajax com Delphi 2005 (ASP.Net)
Compartilhando Código e Dados usando COM
Bkp Firebird/Interbase
Drag and Drop e recursos visuais no DBCtrlGrid
Persistência Objetos - Framework IO
Gráficos em Asp.Net - I

Um dos maiores problemas encontrados por desenvolvedores WEB é o efeito "reload" que acontece quando queremos colocar uma validação ou até mesmo executar uma função dentro de uma página.

Esse artigo tem como principal objetivo acabar com esses tipos de problemas, ou seja, fazer uma aplicação mais dinâmica entre usuário e navegador, utilizando-se de solicitações assíncronas. Para isso utilizaremos o AJAX.

O que é AJAX?

AJAX (Asyncronous Javascript And XML) é o uso sistemático de Javascript e XML para tornar o navegador mais interativo com o usuário, utilizando-se de solicitações assíncronas de informações. O AJAX não é uma tecnologia é uma metodologia, ou seja, um conjunto de tecnologias que interagindo entre si oferecem novos e poderosos recursos.

O "Modelo Clássico" x AJAX

No "modelo clássico" de aplicação web a maioria das ações do usuário no navegador envia solicitações HTTP para o servidor web. O servidor processa essas solicitações e retorna o resultado em uma página HTML para o cliente. Toda essa operação leva um determinado tempo para ser executada, gerando assim um certo desconforto ao usuário que a cada etapa tem que aguardar mais uma vez.

A partir do momento em que a interface da aplicação já esta carregada o usuário não precisaria "ver" a aplicação toda vez que solicitasse algo do servidor, e é justamente o que propomos com o AJAX.

Para utilizar o AJAX com o Delphi 2005 (ASP.Net) utilizaremos o auxilio de um componente Open Source chamado MagicAJAX que pode ser obtido na seção de downloads na página http://www.magicajax.net/, no artigo se utiliza o Release 0.3.0 para .Net 1.1.

Instalação do MagicAJAX

Feito o download do componente devemos descompactar o mesmo para uma pasta que podemos chamar de MagicAjax.

O próximo passo é a instalação do componente no Delphi 2005. Abra o Delphi e vá ao menu Component > Installed .Net Components.

Mude o nome da categoria aonde irá se encontrar os componentes que serão instalados (no exemplo ele é categorizado como "Magic AJAX") Clique em Select an Assembly e vá até a <pasta onde descompactou o MagicAjax >\bin e selecione o arquivo MagicAjax.dll. clique no botão OK e o componente já estará disponível para ser utilizado em uma aplicação Delphi .Net em sua Tool Palette dentro da categoria colocada acima.

Criando uma aplicação simples utilizando Ajax

No Delphi 2005, clique em File/New>Other e escolha ASP.NET Web Application no item Delphi for .Net Projects. Dê o nome de TesteAjax para a aplicação e clique em Ok.

Em primeiro lugar No Project Manager, selecione o arquivo web.config e adicione as linhas abaixo dentro de

<system.web>
  
  <httpModules>
	  <add name="MagicAjax" type="MagicAjax.MagicAjaxModule, MagicAjax" />
   </httpModules>

</system.web>

Salve o arquivo Web.config, selecione o arquivo WebForm1.aspx, pressione F2 e altere seu nome para Teste.aspx. Coloque no formulário o componente da categoria Magic Ajax AjaxPanel e dentro deste componente (AjaxPanel) os seguintes componentes da categoria Web Controls: um botão (ID="btnOk"), dois TextBoxes (ID="txtMsg","txtValorDigitado", respectivamente) , dois Labels e fora do componente um TextBox(ID="txtValorRefresh") e um Label.

No Page_Load de nosso formulário vamos definir o valor do textbox txtValorRefresh para vermos se está funcionando nossa aplicação.

Listagem 1. Evento Page_Load

procedure TTeste.Page_Load(sender: System.Object; e: System.EventArgs);
begin
  // TODO: Put user code to initialize the page here
   if Session["cont"] = nil then Session["cont"] := "0";
   Session["cont"] := Convert.tostring(Convert.ToInt16(Session["cont"].ToString) + 1);
   TxtValorRefresh := Session["cont"].ToString;
end;

Agora iremos implementar o Click do Botão BtnOk

Listagem 2. Evento Click

procedure TTeste.BtnOk_Click(sender: System.Object; e: System.EventArgs);
begin
   txtMsg.Text := txtValorDigitado.text;
end;

Rode a aplicação e para testar insira algo no segundo textbox e clique no botão para poder fazer o mesmo aparecer no textbox acima. Faça isso algumas vezes e repare o valor do textbox que está a direita da pagina, ele manterá o valor 1, ou seja a pagina foi carregada e na primeira vez apenas, se você der um "refresh" na pagina verá que o número que aparece no textbox a direita irá mudar para a quantidade de vezes que foi clicado no botão.

Conclusão

Apesar de ser um simples exemplo ele contempla várias aplicações do dia a dia, como por exemplo controle de dropdownlists, master detail e validações de campos sem termos que a todo o momento dar um refresh na página.

Em um próximo artigo estarei mostrando como utilizar aplicações com banco de dados e AJAX.

Desenvolvimento - Delphi

Leia também