Você está na página 1de 17

0

mais Prximoblog ahcsistemas@gmail.com Painel Sair

Estao ZN
Estamos estudando e o resultado disso postamos aqui. Sinceramente desejamos que o
contedo aqui semeado possa ser til para muitas pessoas.
Seja bemvindo e fique vontade para contribuir da forma que puder e quiser.
Bola pra frente ... :)

sbado, 25 de abril de 2009

Ajax/JSON & Delphi technologies Webbrocker,


Intraweb (ISAPI), IWTemplateProcessorHTML com
CSS

Groove ZN by
Grooveshark

por GMotta ZN
Estou com muita pressa, portanto serei o mais sucinto o possvel ...
O objetivo deste artigo documentar uma soluo desenvolvida para
atender um cliente.
Vamos criar um servio de consulta que dever fornecer dados para
um requisio Ajax. Para isso construiremos uma aplicao servidora
(Delphi/Webbrocker) a qual acessar uma base de dados MS SQL
Server (especificamente o banco de dados para exemplos
Northwind), para executarmos uma consulta parametrizada (valor
que vir na requisio cliente) cujo os dados retornados sero
devidamente formatados para Json (Wik) (No vou usar XML). Ou
seja, como resposta a requisio mencionada, a aplicao servidora
retornar os dado que sero consumidos pelo Ajax/Json.

No sei, ou sei muito pouco sobre o que vc esta falando,


Gerson. Ento veja:
Pesquisa 1
Pesquisa 2
Marco Cant AJax XML/DOM
Neste artigo o Cant mostra como aproveitar o XMLData do
TClientDataSet no DOM/XML (mto legal para delpheros).
Marco Cant Artigo Ajax
Json
Em seguida, desenvolveremos o aplicativo cliente, a camada de
interface, em Delphi/Intraweb, aonde implementaremos uma funo
Javascript. Nela usaremos o XMLHttpRequest do javascript de forma
assncrona.

Mos Obra, Estao ZN!


RSS Feed

ServerSide development
Inicie um projeto Webbrocker no Delphi. Menu File New Other
Web Server Application.

Blog in English Google


Translator version
Busca no blog:

Pesquisar
Contedo
Aleatrio
Cyber Culture
Games
Multimdia
Msica
Programao
WEB

Colaboradores
ralencar
Pedro
Felipe Guero
A tecnologia de service web que vamos usar ser API do IIS (ISAPI). No
WebModule1 adicione os componentes de acesso a dados:
TADOConnetion, TADODataSet, TDataSetProvider, TClientDataSet. No
editor de string de conexo (Edit Connection String) do
ADOConnection, configure a conexo com o SQL Server e em seguida
associe os Datasets (Como Associar? veja no Estao ZN). O Comando
SQl que definiremos no ADODataSet1 ser:

Daniel Bezerra
Bruno Lichot
GMotta ZN

Amigos do EstaoZN
Muito obrigado!
Participardestesite
GoogleFriendConnect

select * from Customers


where CompanyName like :CompanyName

Membros(41) Mais

Criando a Webbrocker Action (WebAction)

Selecione o WebModule1, de maneira que suas propriedades sejam


listadas no Object Inspector. Crie uma Action e configure suas
propriedades conforme ilustrado abaixo:

Arquivo do blog
2011 (6)
2010 (2)
2009 (25)

Ago (2)
Mai (6)
Abr (6)
Controle de Verso
"Seus problemas
acabaram!"
Ajax/JSON & Delphi
technologies
Webbrocker, Intra...
Navegar? Pois , eu
preciso ...
O Cara o Kutiman
Mdias na Web A
questo de
propriedade
intelectu...
Evento OnAction da Action ZnConsClientes:

Validao de CPF e
CNPJ com Javascript
Delphi/In...
Mar (5)
Fev (2)
Jan (4)
2008 (80)
2007 (125)

tags
.NET
ADO
AJAX
Apache
Arquitetura de Software
uses
Math, StrUtils;
procedure TWebModule1.WebModule1ZnConsClientesActi
on(Sender: TObject;
Request: TWebRequest; Response: TWebResponse; va
r Handled: Boolean);
const
ZnTag = '%s:%s';
var
StrStatment: String;
i, CodRetorno: Integer;
begin
with ClientDataSet1 do

ASP.NET
Audio
Automao OLE
Banco de Dados
BDS
C#
Componentes

begin
Params[0].AsString := '%' + Request.QueryField
s.Values['znNomeCli']+ '%';
try
Open;
CodRetorno := IfThen(IsEmpty, -1, 1);
StrStatment := StrStatment +
Format(ZnTag, ['codretornoZn',
IntToStr(CodRetorno)]);
if CodRetorno = 0 then Exit;
for i := 0 to Pred(FieldCount) do
begin
StrStatment := StrStatment + ','+
Format(ZnTag, [LowerCase(ClientDataSet1.
Fields[i].FieldName),
IfThen((ClientDataSet1.Fields[i].AsStr
ing = ''), QuotedStr('-'),
QuotedStr(ClientDataSet1.Fields[i].A
sString))]);
end;
finally
Close;
Response.Content := Format('{%s}',[StrStatme
nt]);
end;
end;
end;

Controle de Verso
CSS
Cyber Culture
DBA
Delphi
Diversos
English
Ferramentas Case
Flash
HTML
Humor
IDE
Internet
Internet Explorer
Intraweb
Introduo a Programo
Introduo Harmonia
Funcional

Para usar as verses sobrecarregadas da funo IfTehn precisamos,


para este exemplo, declarar (fazer uses das ...) as units Math e
StrUtils (observe na linha 2 do trecho acima).
Pronto, acabamos essa primeira parte! Antes de compilar, garanta
que o ADOCOnnection esteja desconectado. Propriedade Connected
igual a false. Agora sim!!! Compile a aplicao servidora para
gerar a dll a qual faremos deploy no IIS (Deploy de uma dll ISAPI).
Vou criar o diretrio virtual no IIS com o nome de ajaxjsonzn.
Aps ter tido sucesso em realizar o deploy, vamos testar.
Para isso digitar no browser "http://localhost/ajaxjsonzn/?
znNomeCli=Cactus" para se emocionar ao ver o que acabamos de
criar.

Java
Javascript
JCL
Json
Linq
Linux
Literatura Delphi
Mencoder
Modelagem
Mplayer
Multimidia
Multimdia
Music
MySQL
Msica
Navegadores
NetBeans

Veja a string retornada pela nossa aplicao servidora Webbrocker:


{codretornoZn:1,customerid:'CACTU',companyname:'Ca
ctus Comidas para llevar',contactname:'Patricio Si
mpson',

Novidades
OLE DB
Oracle

contacttitle:'Sales Agent',address:'Cerrito 333'


,city:'Buenos Aires',region:'-',
postalcode:'1010',country:'Argentina',phone:'(1)
135-5555',fax:'(1) 135-4892'}

Partituras
PHP
PL/SQL
POO
RPC

ClienteSide development
Meu querido leitor do Estao ZN, neste momento vamos comear
esta segunda parte do artigo construindo uma pgina html. Hum,
hhh?!?!? Como?? Mas o assunto no Delphi? Sim, o assunto gira em
torno das tecnologias para web existentes no Delphi. O que ns vamos
fazer agora demonstrar tambm como o framework Intraweb pode
interagir com projetos onde as pginas web so desenvolvidas a parte
do Delphi. Existem vrias situaes onde isso poder ser
extremamente vantajoso. Por exemplo, imagine um projeto onde
exista uma nfase grande na parte de design e por isso as pginas do
site so desenvolvidas especificamente pela equipe de designers e
diante disto a equipe de desenvolvimento deve integrlas a parte de
lgica e persistncia desenvolvida no Delphi. Este cenrio no
contexto Delphi at bem comum, penso que sim.
Portanto, antes de qualquer coisa execute seu editor preferido de
pginas htm e Javascript e bola pra frente. Abaixo, segue o cdigo d
pagina que desenvolvi para este exemplo:

RSS
Script
Shell Script
Sibelius
Slackware
SQL
Subversion
Suporte
SVN
Tableless
Tortoise
Tratamento de Excees
Tcnicas de desenvolvimento
UDF

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans


itional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtm
l1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html
; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!-.AreaTexto {
font-family: "Comic Sans MS", "Courier New", Geor
gia;
width: 420px;
height:540px;
background-color:#FFFF38;
}
-->
</style>
<script type="text/javascript">
var ZnXmlAjaxHttpObj;
function ZnGetClienteWsAjx(ZnMyName) {
alert('estou na funo!');
if (typeof XMLHttpRequest != "undefined"){ZnXm
lAjaxHttpObj = new XMLHttpRequest();}
else{
ZnXmlAjaxHttpObj = new ActiveXObject('Msxml2.
XMLHTTP');
if (!ZnXmlAjaxHttpObj){ZnXmlAjaxHttpObj = new
ActiveXObject('Microsoft.XMLHTTP');}
}
alert(ZnMyName.value);
var ZnSpan = document.getElementById("IWLABEL1

UML
Variedades
VB6
VdeoGame
WAP
Web
Web 2.0
Web 3.0
Webservice
Windowhttp://www.blogger.
com/img/blank.gifs
Windows
Windows API
WML
XML
XSL
Zn Ringtones

ZN Media Player

");
ZnSpan.innerHTML = "Estaa Zn: Buscando dados do
Cliente pelo nome fornecido: " + ZnMyName.value +
" ....";
var url = "http://localhost/ajaxjsonzn/?znNomeCli
="+ ZnMyName.value;
ZnXmlAjaxHttpObj.open("GET", url, true);
ZnXmlAjaxHttpObj.onreadystatechange = ZnDynPro
cessaReqBuscaCliente;
ZnXmlAjaxHttpObj.send(null);
}

Links
Willian Rodrigues
Web 4
Shimatai
Pensamentos de um
Profissional de TI
Malta on Delphi

function ZnDynProcessaReqBuscaCliente() {
var ZnSpan2 = document.getElementById("IWLABEL
2");
var ZnElement = document.getElementById("IWEDIT1
");
ZnSpan2.innerHTML = 'Processando ................
..';
if (ZnSpan2.innerHTML.indexOf("buscando dados",0)
>= 0){ZnSpan2.innerHTML = "Processando ...";}
else {ZnSpan2.innerHTML = "<b>buscando dados do
Cliente: </b>" + ZnElement.value + " ....";}

Linguagem de Mquina

if (ZnXmlAjaxHttpObj.readyState == 4) {
if (ZnXmlAjaxHttpObj.status == 200) {
processJsonEstacaoZn(ZnXmlAjaxHttpObj.respo
nseText);
}
}
else return false;
}

All The Things You


Are03/09/2008

function processJsonEstacaoZn(obj1) {

Rom Msica17/05/2007

var ObjLandjah;
eval('ObjLandjah = ' + obj1);
var Aux =
" <br /> customerid: "+ ObjLandjah.custome
rid +
" <br /> contactname: "+ ObjLandjah.contac
tname +
" <br /> contacttitle: "+ ObjLandjah.conta
cttitle +
" <br /> companyname: "+ ObjLandjah.compan
yname +
" <br /> country: "+ ObjLandjah.country +
" <br /> CEP/postal code: "
+ ObjLandjah
.postalcode
+
"<br /> Regio: "
+ ObjLandjah.region +
"<br /> Cidade: " + ObjLandjah.city +
"<br />Logradouro: " + ObjLandjah.address +
" <br /> fax: " + ObjLandjah.fax +
" <br /> phone: "+ ObjLandjah.phone;
alert(Aux);
document.getElementById("cj").innerHTML += '- <b>
Ningum vai subir #@#@%#@%#%@ ... vai ficar todo m
undo quietinho ae.</b>';
document.getElementById("cj").innerHTML += Aux;
document.getElementById("IWMEMO1").innerHTML += '
\n <b>100% Quatorze? </b>';
document.getElementById("IWMEMO1").innerHTML +
= ' \n ************************************';
//**********************************************
******
var insertData = "<b> Resultado Consulta www.est
acaozn.blogspot.com:</b>";
try {
//alert('Cod Retorno: ' + ObjLandjah.codretornoZn
);
switch (ObjLandjah.codretornoZn * 1) {
case 1:

Bruno Lichot Borland


Atelier das Idias

Helio Delmiro
Beijo Partido10/09/2008

Inai26/05/2007
Um Novo Tempo
Msica20/05/2007

document.getElementById("IWMEMO1").innerHTML +=
' \n - Cavera meu Capito. ';
document.getElementById("IWMEMO1").innerHTML +=
' \n ************************************';
insertData += " <br /> customerid: "+ ObjLandjah
.customerid +
" <br /> contactname: "+ ObjLandjah.contac
tname +
" <br /> contacttitle: "+ ObjLandjah.conta
cttitle +
" <br /> companyname: "+ ObjLandjah.compan
yname +
" <br /> country: "+ ObjLandjah.country +
" <br /> CEP/postal code: "
+ ObjLandjah
.postalcode
+
"<br /> Regio: "
+ ObjLandjah.region +
"<br /> Cidade: " + ObjLandjah.city +
"<br />Logradouro: " + ObjLandjah.address +
" <br /> fax: " + ObjLandjah.fax +
" <br /> phone: " + ObjLandjah.phone;
//alert("Case, estou aqui");
// Abaixo, veja como atribuir valor do JavaScrip
t Object Notation ao IWMemo e aos IWEdits
document.getElementById("IWMEMO1").innerHTML +=
' \n ************************************';
document.getElementById("CEP").value = ObjLandja
h.postalcode;
document.getElementById("CEP").disabled =
true;
document.getElementById("IWMEMO1").innerHTML +=
" \n CEP: " + ObjLandjah.postalcode;
document.getElementById("CONTACTNAME").value = O
bjLandjah.contactname;
document.getElementById("CONTACTNAME").dis
abled = true;
document.getElementById("IWMEMO1").innerHTML +=
" \n Contato: " + ObjLandjah.contactname;
document.getElementById("CONTACTTITLE").value =
ObjLandjah.contacttitle;
document.getElementById("CONTACTTITLE").disabled
= true;
document.getElementById("IWMEMO1").innerHT
ML += " \n Contato: " + ObjLandjah.contacttitle;
document.getElementById("CIDADE").value = ObjLan
djah.city;
document.getElementById("CIDADE").disabled
= true;
document.getElementById("IWMEMO1").innerHTML
+= " \n Cidade: " + ObjLandjah.city;
document.getElementById("BAIRRO").value = "Bl
a!";
document.getElementById("BAIRRO").disabled
= true;
document.getElementById("FAX").value = ObjLandja
h.fax;
document.getElementById("FAX").disabled =
true;
document.getElementById("IWMEMO1").innerHTML +=
"\n Fax: " + ObjLandjah.fax;
document.getElementById("LOGRADOURO").value = Ob
jLandjah.address;
document.getElementById("LOGRADOURO").disa
bled = true;
document.getElementById("IWMEMO1").innerHTML +=
"\n Logradouro:" + ObjLandjah.address;
document.getElementById("COMPANYNAME").value =
ObjLandjah.companyname;
document.getElementById("COMPANYNAME").dis
abled = true;
document.getElementById("IWMEMO1").innerHTML +=
"\n Nome da Empresa:" + ObjLandjah.companyname;
document.getElementById("COUNTRY").value = ObjLa
ndjah.country;
document.getElementById("COUNTRY").disable
d = true;

document.getElementById("IWMEMO1").innerHTML +=
"\n Pais:" + ObjLandjah.country;
document.getElementById("UF").value = ObjLandjah
.region;
document.getElementById("UF").disabled = t
rue;
document.getElementById("IWMEMO1").innerHTML
+= " \n Regio: " + ObjLandjah.region;
document.getElementById("PHONE").value = O
bjLandjah.phone;
document.getElementById("PHONE").disabled
= true;
document.getElementById("IWMEMO1").innerHTML +=
" \n Tel: " + ObjLandjah.phone;
document.getElementById("IWMEMO1").innerHTML +=
'\n ************************************';
break;
case -1: insertData += "Cliente no encontrado!"
; break;
case -2: insertData += "Valor digitado invlido!
"; break;
case -3: insertData += "Ta com nojinho 02?."; b
reak;
case -4: insertData += "AH ESSA ALTURA DO CAMPEO
NATO VC TA SEM AH BANDOLEIRA ??!"; break;
default: "PEDE PRA SAIR 01. Pede pra sair.";
}
}
catch(Error) {
insertData = "<br> <font color=#FF0000> eRrO.
TIRA ESSA ROUPA PRETA QUE VC NO CAVEIRA. </font
> As Landjhas de mirandjas!!!"
}
document.getElementById("IWLABEL2").innerHTM
L += insertData;
document.getElementById("IWLABEL1").innerHTML +
= " <br /><b> Os senhores esto bem? Os senhores e
sto feridos? Algum dos senhores esto baleados? "
+
" Ento, no prximo post vcs vo aprender a car
regar corpos!!! </b>"
document.getElementById("IWMEMO1").innerHTML +=
' \n ';
}

</script>
</head>
<body>
<form id="form1" name="form1" method="post" action
="">
<div id="PosControles" style="position: absolute;
top: 32px; left: 12px; width: 887px; height: 92px;
background-color: #3399CC;
font-size:16px; font-weight:400" align="justify"
><br />Digite o Nome do Cliente: {%IWEdit1%} | {%I
WButton1%}
<br>
{%Logradouro%}{%Bairro%}{%Cidade%} {%UF%}{%CEP%} {
%CompanyName%}
{%ContactName%}
{%ContactTitle%}
{%Phone%}
{%Fax%}
{%Country%}
{%IWLink1%} <a href="http://localhost/estacaozncl
iente">Reload Page</a></div>
<div id="PosSpan" style="position: absolute; top:
128px; left: 12px; width: 440px; height: 580px; ba
ckground-color: #99FF99;">
{%IWLabel1%} {%IWLabel2%}

<span id="cj">
</span>
</div>
<div id="PosMemo" style="position: absolute; top:
128px; left: 458px; width: 440px; height: 580px; b
ackground-color: #99FF99;"
align="center"><p>
{%IWMEMO1%}
testando!!
</div>
</form>
</body>
</html>

Salve a pgina html (o arquivo html, referente a pgina que


acabamos de criar) com o nome de ZnPageAjaxJsonIntraweb.html.

O prximo passo, ser criar a aplicao cliente intraweb. Retornemos


ao Delphi ento, para iniciarmos um projeto Intraweb ISAPI. No menu
File New Other Intraweb ISAPI Application.
Adicione no IWForm1 os seguintes componentes:

IWTemplateProcessorHTML1: TIWTemplateProcessor
HTML;
IWLabel1: TIWLabel;
IWEdit1: TIWEdit;
IWButton1: TIWButton;
IWMemo1: TIWMemo;
CEP: TIWEdit;
UF: TIWEdit;
Bairro: TIWEdit;
Logradouro: TIWEdit;
Cidade: TIWEdit;
IWLabel2: TIWLabel;
CompanyName: TIWEdit;
ContactName: TIWEdit;
ContactTitle: TIWEdit;

Phone: TIWEdit;
Fax: TIWEdit;
Country: TIWEdit;

No evento OnCreate do IWForm1 codifique conforme ilustrado


abaixo:
procedure TformMain.IWAppFormCreate(Sender: TObjec
t);
begin
Self.TemplateProcessor := IWTemplateProcessorHTM
L1;
IWTemplateProcessorHTML1.Templates.default := 'Z
nPageAjaxJsonIntraweb.html';
IWLabel1.Caption := '';
IWMemo1.Font.Enabled := False;
IWMemo1.Font.CSSStyle := 'AreaTexto';
CEP.Width := 80;
UF.Width := 40;
Cidade.Width := 120;
Logradouro.Width := 180;
Bairro.Width := 90;
IWButton1.ExtraTagParams.Add('onClick=ZnGetCLien
teWsAjax(IWEDIT1)');
IWMemo1.Lines.Add('');
IWEdit1.Text := 'Cactus Comidas para llevar';
end;

Observe na linha 7, estou atribuindo dinamicamente ao IWMemo1


uma classe CSS ('AreaTexto') a qual est definida na pgina HTML
que criamos anteriormente.
Ok, muito bem, meus amigos e minhas amigas, a parte referente a
aplicao cliente termina aqui!! Isso mto bom! Agora, chegado o
momento do bom e velho amigo deploy. Para isso, um build all na
aplicao Intraweb (alt, p, b) bem vindo, ela ser compilada e a dll
para deploy ser gerada. So .. next step ... enjoy yourself ...
O nome do diretrio virtual que vou criar ser estacaozncliente.

No mesmo diretrio onde est a dll gerada pelo Delphi na compilao


deste projeto Intraweb, crie um diretrio onde ficar a pagina html
que o IWTemplateProcessorHTML1 vai trabalhar. Me refiro ao arquivo
da
pgina
que
criamos
anteriormente,
ZnPageAjaxJsonIntraweb.html. Esse diretrio tem que se chamar
Templates, desta forma no precisamos definir nenhuma
configurao para TemplateProcessorHTML encontrar o arquivo.

Testando Aplicao cliente IntraWeb/ISAPI.

O link Reload Page coloquei para facilitar o desenvolvimento da


aplicao cliente. Assim evito de ficar digitandoa url do servio toda
vez que houver alguma alterao, seja na aplicao servidora, seja
na aplicao cliente, ou na pgina html.
Concluso
A partir da experincia realizada e documentada neste artigo,
destaco as seguintes observaes:
Usar a tecnologia Ajax nos seus sistemas web, sites, ou servios traz,
alm de um ganho de performance, escalabilidade e
interoperabilidade. Isso porque a soluo Ajax independente da
tecnologia que esteja sendo utilizada no clientside. Pretendo, para o
prximo post documentar um exemplo da mesma soluo
desenvolvida neste arquivo, sendo que a camada cliente desenvolverei
em Java com o Netbeans.
O uso do JavaScript Object Notation (Json) descomplica muito a
desenvolvimento de uma soluo baseada em jax.
Um ponto muito importante neste artigo o emprego do componente
processador de templates o IWTemplateProcessorHTML. Ele
permite que seu form Intraweb seja construdo em cima de um
arquivo HTML criado separadamente. Dessa forma um leque de
possibilidades se abre. No momento a que eu mais quero destacar
que com isso possvel modularizar seu projeto colocando toda a
parte de layout, disign, bem como o processamento clientside. Com
isso, todo o Javascript que trabalhamos nos artigos anteriores pode
ser definido na pgina web. Igualzinho feito por webmasters,
inclusive usando a tag src para cdigos Javascript que ficam em
arquivos separados.
Javascript placement: o Cdigo JavaScript pode estar fisicamente
disposto em um diretrio especfico para este fim, num arquivo .js
separado da pgina HTML. Isso melhora inda mais a modularizao do
seu sistema, site, portal, etc...
O arquivo fonte do Javascript em questo referenciado na pgina
HTML usando a tag script o atributo "src" com o nome do arquivo e
o path definidos como valor.

<head>
<script language="JavaScript" src="ZnJavaScriptF
ile.js"></script>
</head>

Estive conversando com o Felipe e com o Malta sobre os exemplos


anteriores que estive postando. Onde demonstrei o cdigo Javascript
definido como string no meio do cdigo Delphi. Essa forma de
implementar um metodologia que condeno enfaticamente nos meus
projetos. Inclusive, todos dois, tanto o Felipe, quanto o Malta,
concordam e estavam me chamando a ateno sobre isso. Que o
Javascript no meio do cdigo Delphi, mesmo eu organizando,
atravs de constantes o caos, uma soluo macarrnica, feia,
nojenta, asquerosa. Entretanto, eu fiz dessa forma nos exemplos
anteriores porque acredito que assim o artigo que estou escrevendo
para o Estao ZN fica menor, menos complexo, mais didtico, na
medida em que eu procuro estar focado nos assuntos que pretendo
falar naquele momento. Quando estou postando aqui minha nfase
totalmente didtica. Entendo que para passar um conhecimento
complexo ele deve ser simplificado, de maneira que seja reduzida
toda complexidade inerente ao problema em questo.
Portanto, de agora em diante, sugiro que voc cuide para que,
imperativamente, o Javascript fique separado da aplicao Delphi.
Para isso temos basicamente dois caminhos a tomar: O primeiro seria
usar o IWTemplateProcessorHTML. Uma segunda opo seria usar
um LoadFromFile, ou seja ler dinamicamente arquivos com as
funes Javascript. Se voc optar por usar o IwTemplateProcesso,
implementar desta forma, o js na pgina HTML, uma ao
intuitiva. Como fazer isso est demostrado neste artigo. Caso
negativo, uma idia, proposta pelo Malta, que eu gostei bastante,
seria do Delphi, fazer um LoadFromFile de um arquivo, onde
estaria com cdigo JavaScript parametrizado (semelhante a um
parmetro de um comando SQL). A idia usar, ao invs de
parmetros de FormatString (%s) uma sintaxe como nome de
parmetros (:nome) e fazer substituio por pares (nome, valor).
Deixeme explicar melhor:
Veja num dos artigos anteriores: O Cdigo Javascript que defini no
tem %s para usar na funo Format? Ento, substitua todos o %s
por uma sintaxe prpria, que estaramos criando, que represente o
nome de um parmetro. Por exemplo: ..... :par1 ... :idade ...
:cidade... :idade. A exemplo de um comando SQL num TSQLQurey.
Para trabalhar em conjunto, criaramos uma funo para substituir os
parmetros por valores em runtime, por exemplo: function
ZnReplaceParams(const znParmName, znParamValue: String). A
chamada seria: ReplaceParams('idade', '18');. De cara podemos
citar como vantagens melhor legibilidade do cdigo Javascript, alm
de no fica dependente de posio (como o caso do Format(%s)).
Dentro da funo caixa preta ZnReplaceParams, um StringReplace
pode dar conta do recado, com rfReplaceAll e rfIgnoreCase. O que
inclusive facilita quando voc precisa repetir o mesmo valor vrias
vezes no mesmo script bastaria repetir o nome da "macro" ou
parmetro. Boa Malta, Estao Zn agradece! Tks!!
Uma outra abordagem seria usar argumentos na prpria funo
Javascript, a qual vai estar definida num arquivo .txt, ou .js, que

seja, e no Delphi atribuir as definies das chamadas a essas funes


nos eventos Javascript, nas propriedades ExtragParams, ou
ScriptEvent. Como exemplifiquei no artigo sobre validao de CIC.

Falar sobre modularizao muito simples. Mas demonstrar, no


mnimo trabalhoso. Eu prefiro inclusive demonstrar o como no
fazer, para melhorar, aumentar a aderncia da explicao do sobre
como fazer.
Aconselho ao desenvolvedor que decidir usar o Delphi/Intraweb ter
muita ateno na hora de referenciar os objetos, inputs, submits,
selects, criados pelo Intraweb, no que tange a caixa do nome dos
controles definidos no Delphi. Isso pq o Delphi no case sensitive,
conseqentemente o desenvolvedor delphi no dever, a pricpio,
estar acostumado com essa restrio. Portanto, cuidado com
comandos do tipo document.getElementById("IWMEMO1"), porque
todo componente Intraweb criado na pgina html com o nome em
CAIXA ALTA. A funo getElementById sensvel a caixa.
Programar em Javascript exige muita ateno a questes extra
intelectuais, pois voc no vai poder contar com code insight, nem
autocomplemento de cdigo (code complete) e ainda existe o
overhead de ateno na questo do case sensitive sem contar que as
mensagens de erro no so to amigveis. Uma ferramenta que pode
ajudar neste sentido so os plugins para desenvolvimento web do Fire
Fox.
Outro ponto adverso desenvolver um script clientside compatvel
com todos os browsers. Isso exige bastante de quem est
desenvolvendo. Entretanto os bnus adquiridos em usar enfaticamente
Javascript acaba compensando todos os nus listados. Alm disso,
com o tempo o desenvolvedor ganha prtica nesta abordagem e esses
fatores negativos acabam perdendo sua fora.
A tecnologia Json ainda bem nova, nas minhas pesquisas encontrei
muito pouca gente usando. Mas pra minha surpresa um nmero
razovel de pessoas, blogs, falando sobre. Dei uma pesquisada no
google trends http://www.google.com/trends sobre as buscas sobre
Json.

Abaixo, cdigo completo das units Delphi:


Aplicao Cliente Intraweb

unit IWUnit1;
{PUBDIST}
interface
uses
IWAppForm, IWApplication, IWTypes, IWCompMemo, I
WCompButton, IWCompEdit,
Controls, IWControl, IWCompLabel, Classes, IWLay
outMgr,
IWTemplateProcessorHTML, IWHTMLControls;
type
TformMain = class(TIWAppForm)
IWTemplateProcessorHTML1: TIWTemplateProcessor
HTML;
IWLabel1: TIWLabel;
IWEdit1: TIWEdit;
IWButton1: TIWButton;
IWMemo1: TIWMemo;
CEP: TIWEdit;
UF: TIWEdit;
Bairro: TIWEdit;
Logradouro: TIWEdit;
Cidade: TIWEdit;
IWLabel2: TIWLabel;
CompanyName: TIWEdit;
ContactName: TIWEdit;
ContactTitle: TIWEdit;
Phone: TIWEdit;
Fax: TIWEdit;
Country: TIWEdit;
procedure IWAppFormCreate(Sender: TObject);
public
end;
implementation
{$R *.dfm}

uses
ServerController, IWForm;
//ajaxconcorretor
procedure TformMain.IWAppFormCreate(Sender: TObjec
t);
begin
Self.TemplateProcessor := IWTemplateProcessorHTM
L1;
IWLabel1.Caption := '';
IWMemo1.Font.Enabled := False;
IWMemo1.Font.CSSStyle := 'AreaTexto';
CEP.Width := 80;
UF.Width := 40;
Cidade.Width := 120;
Logradouro.Width := 180;
Bairro.Width := 90;
IWButton1.ExtraTagParams.Add('onClick=return ZnG
etClienteWsAjx(IWEDIT1);');
IWMemo1.RawText := True;
IWMemo1.Lines.Add('');
IWEdit1.Text := 'Cactus Comidas para llevar';
end;
end.

Aplicao Servidora Webbrocker

unit Unit1;
interface
uses
SysUtils, Classes, HTTPApp, DBClient, Provider,
DB, ADODB;
type
TWebModule1 = class(TWebModule)
ADOConnection: TADOConnection;
ADODataSet1: TADODataSet;
DataSetProvider1: TDataSetProvider;
ClientDataSet1: TClientDataSet;
ClientDataSet1CustomerID: TWideStringField;
ClientDataSet1CompanyName: TWideStringField;
ClientDataSet1ContactName: TWideStringField;
ClientDataSet1ContactTitle: TWideStringField;
ClientDataSet1Address: TWideStringField;
ClientDataSet1City: TWideStringField;
ClientDataSet1Region: TWideStringField;
ClientDataSet1PostalCode: TWideStringField;
ClientDataSet1Country: TWideStringField;
ClientDataSet1Phone: TWideStringField;
ClientDataSet1Fax: TWideStringField;
procedure WebModule1ZnConsClientesAction(Sende
r: TObject;
Request: TWebRequest; Response: TWebResponse
; var Handled: Boolean);
private
{ Private declarations }
public
{ Public declarations }
end;
var

WebModule1: TWebModule1;
implementation
{$R *.dfm}
uses
Math, StrUtils;
procedure TWebModule1.WebModule1ZnConsClientesActi
on(Sender: TObject;
Request: TWebRequest; Response: TWebResponse; va
r Handled: Boolean);
const
ZnTag = '%s:%s';
var
StrStatment: String;
i, CodRetorno: Integer;
begin
with ClientDataSet1 do
begin
Params[0].AsString := '%' + Request.QueryField
s.Values['znNomeCli']+ '%';
try
Open;
CodRetorno := IfThen(IsEmpty, -1, 1);
StrStatment := StrStatment +
Format(ZnTag, ['codretornoZn',
IntToStr(CodRetorno)]);
if CodRetorno = 0 then Exit;
for i := 0 to Pred(FieldCount) do
begin
StrStatment := StrStatment + ','+
Format(ZnTag, [LowerCase(ClientDataSet1.
Fields[i].FieldName),
IfThen((ClientDataSet1.Fields[i].AsStr
ing = ''), QuotedStr('-'),
QuotedStr(ClientDataSet1.Fields[i].A
sString))]);
end;
finally
Close;
Response.Content := Format('{%s}',[StrStatme
nt]);
end;
end;
end;
end.

tags: AJAX, CSS, Delphi, Internet, Intraweb, Javascript, Json, Web

Nenhum comentrio:
Postar um comentrio

Digiteseucomentrio...

Comentarcomo:

Publicar

Alexandre(Google)

Visualizar

Postagem mais recente

Sair

Notifiqueme

Pgina inicial

Postagem mais antiga

Assinar: Postar comentrios (Atom)

BlogBlogs.Com.Br