Você está na página 1de 18

1

2 ndicemduIo 5
nd|ce
Aresentaco 4
lntroduco a javaScrit 5
A misso ..................................................................................... 5
linguagens disonveis ara cIient scrit ................................... 6
lciI de usar, fciI de arender ................................................... 6
Meu rimeiro rograma em javaScrit ........................................ 6
lxemIo de verificaco de camos de formuIrio ...................... 9
Projetando o site 19
A misso ................................................................................... 19
Navegaco ................................................................................ 20
locaIizaco dos arquivos do site............................................... 20
Criaco da estrutura do site ...................................................... 21
Construindo o site 22
A misso ................................................................................... 22
ModeIagem do banco de dados................................................ 23
8anco de dados remodeIado .................................................... 23
O arquivo gIobaI.asa ................................................................. 26
Construco da gina de identificaco ..................................... 29
Construco da gina ldentificacaox.as .................................. 46
Construco da gina de cadastro de usurios......................... 56
Construco da gina Cadastrox.as......................................... 76
Construco da gina de comras ............................................ 84
AIteraco da gina miniatura.as............................................ 98
Construco da gina comrex.as ........................................ 106
!

"
3 ndicemduIo 5
Wl8kl1 (www.webkit.com.br) - MduIo didtico 5
Um roduto de
lrum Access (www.forumaccess.com)
8Iikstein ConsuItoria - Comuncaco e Jecnologa (blkstenwebkt.com.br)
ldeaIizaco
Uanel urd (danelforumaccess.com)
Coordenaco do rojeto
Paulo lksten (paulowebkt.com.br)
PubIicidade e Marketing
Oscar urd (oscarforumaccess.com)
kedaco
Marcelo Camargo - Ndvanced Solutons (www.as-busness.com.br)
lstruturaco e reviso didtica
Paulo lksten (paulowebkt.com.br)
keviso tcnica
Marco Nntno |ulan (marcoforumaccess.com)
lditoraco lIetrnica
Pedro Mguez (pedrogouveayahoo.com)
logotio e Projeto Crfico
Myuk watanabe (mkbraslhotmal.com)
Criaco do Website
\cente kezende (vcentev8.com.br)
keviso de texto
Mara Nar M. kebelo
eta-testers
Uav Uuchovn Slva
Smone de Olvera Custdo
Cleber de Paula
Coyright (c) 1999 - 1odos os direitos reservados.
l roibida a reroduco totaI ou arciaI, or quaisquer meios, sem autorizaco
escrita da lrum Access e 8Iikstein ConsuItoria.
verso (|nforme sempre que consultar o suporte): 5/1.0
Construindo o site 22
Construco da gina de Parabns! ......................................... 116
AtuaIizaco dos Iinks ara a gina de comras ..................... 118
1estando seu trabaIho e cenas do rximo mduIo ................ 119
"
4
Npresentaco
A misso
No mdulo anter|or aprendemos como ut|l|zar a tecnolog|a ASP (Active
Server Pages) para a construco de pg|nas d|nm|cas [untamente com
ADO (Activex Data Objects) para acesso a bancos de dados.
O uso de um banco de dados (em nosso caso, o V|crosoft Nccess) fac|l|tou
mu|to nosso trabalho de atual|zaco das |nformaces do sI1.
O que vamos fazer neste mdulo e apl|car os conhec|mentos [ adqu|r|dos
e ma|s alguns novos conce|tos para constru|r um sI1 de vendas pela
Internet. Cr|aremos uma "cesta de comras" para cada usur|o
cadastrado, de forma que eles possam selec|onar as m|n|aturas dese[adas
e ad|c|on-las a cesta. Os dados das compras real|zadas f|caro
armazenados em um banco de dados.
No f|nal deste mdulo veremos que a construco de um sI1 de vendas
pela Internet no e ma|s uma tarefa |mpossvel: est ao nosso alcance.
Ao finaI desse mduIo, voc saber:
constru|r um sI1 de vendas pela Internet,
escrever strIp1s ut|l|zando a l|nguagem javaScrit,
Pr-requisitos
Noces de lg|ca de programaco.
kev|so do captulo 8anco de Dados e lnternet do MduIo 4.
Software
Personal web Server 4.0.
|rontPage Lxpress 2.0.
Internet Lxplorer 5.0.
Atividades
Le|tura do mater|al |mpresso.
Instruces e exercc|os passo a passo.
1emo revisto
Ue 6h a 12h.
aresentacomduIo 5
1
.

N
p
r
e
s
e
n
t
a
c

o
5
Introduco a [avaScr|pt
A misso
N l|nguagem PJVL nos fornece apenas a capac|dade de formatar e cr|ar
IInxs em uma pg|na u.
Se qu|sermos algo ma|s elaborado, como a execuco de um pequeno
programa que ver|f|que a val|dade dos dados d|g|tados pelo usur|o em
um formulr|o, prec|samos de uma ferramenta ma|s poderosa. L
|mportante que esse programa se[a executado no navegador do usur|o:
|sso e exatamente o oposto de NSP, que e executado no serv|dor u.
Lsses pequenos programas so chamados I?HEFJI cl|ente (tIIn1 strIp1s),
porque so executados no navegador do usur|o. Os fornecem uma
poderosa flex|b|l|dade durante a |mplementaco de pg|nas u.
Nossa m|sso neste captulo ser entender o func|onamento dos tIIn1
strIp1s e sua ut|l|zaco em nosso sI1.
Ao finaI desse mduIo, voc saber:
como func|onam os cIient scrits,
ut|l|zar cIient scrits com a l|nguagem javaScrit,
entender e |mplementar formulr|os para entrada de |nformaces.
Software
Personal web Server 4.0.
|rontPage Lxpress 2.0.
Internet Lxplorer 5.0.
Atividades
Le|tura do mater|al |mpresso.
Instruces prt|cas passo a passo.
Lxercc|os prt|cos.
1emo revisto
Ue 1 a 2 horas.
a missointroduco a javascrit
2
.

I
n
t
r
o
d
u
c

o

a

[
a
v
a
s
c
r
|
p
t
6
linguagens disonveis ara cIient scrit
Ntualmente ex|stem duas l|nguagens para escrever tIIn1 strIp1s:
v8Scrit: l|nguagem desenvolv|da pela V|crosoft, baseada na popular
l|nguagem de programaco \|sual 8as|c. O v8Scrit e, na verdade, um
\|sual 8as|c s|mpl|f|cado.
javaScrit: e a l|nguagem ma|s ut|l|zada para tIIn1 strIp1s, sendo uma
espec|e de verso s|mpl|f|cada" da l|nguagem [ava.
O javaScrit func|ona tanto no Netscae Navigator como no lnternet
lxIorer da V|crosoft. O v8Scrit surg|u ma|s recentemente e e suportado
apenas pelo lnternet lxIorer, a part|r de sua verso 3.0.
Por sua ma|or ace|taco pelos navegadores, |remos adotar para os exem-
plos deste curso a l|nguagem javaScrit.
lciI de usar, fciI de arender
javaScrit e relac|onado d|stante e |nd|retamente ao java, porem ma|s
l|m|tado. No podemos escrever apl|caces |ndependentes e ele tem
capac|dade l|m|tada para le|tura e gravaco de arqu|vos. Nlem d|sso,
javaScrit pode rodar apenas na presenca de um |nterpretador, tanto em
um serv|dor u como em um navegador. Um |nterpretador e como um
tradutor que l o programa e o transforma em |nstruces d|retas para o
computador.
javaScrit e uma l|nguagem sem def|n|co de t|pos. Isto s|gn|f|ca que no
temos que declarar expl|c|tamente t|pos de dados para as var|ve|s. Nlem
d|sso, em mu|tos casos, o javaScrit far converses automt|cas quando
for necessr|o. Se voc tentar ad|c|onar um nmero a um |tem que se[a
texto (um s1rIn), o nmero e automat|camente convert|do para texto.
\amos agora conhecer um pouco ma|s sobre essa l|nguagem, por me|o de
alguns exemplos.
Meu rimeiro rograma em javaScrit
Como a ma|or|a das outras l|nguagens de programaco, javaScrit e
escr|to no formato texto e organ|zado em |nstruces, blocos de |nstruces
relac|onadas e comentr|os.
Iinguagens ara cIient scritintroduco a javascrit
7
lnstruces
Uma instruco de cd|go javaScrit cons|ste em um ou ma|s |tens e
smbolos em uma l|nha. Uma nova l|nha |n|c|a uma nova |nstruco, mas e
bom term|nar suas |nstruces expl|c|tamente. \oc pode faz-lo com o
ponto e vrgula (,), que e o carcter de term|naco" do javaScrit.
sNsms 1s1s',
.s| 1t+s,s +sW Dsts|,
Um grupo de |nstruces javaScrit que esto cont|das em chaves (l)) e
chamado de bIoco. 8locos de |nstruces so usados, por exemplo, em
funces e cond|c|ona|s. No exemplo segu|nte, a pr|me|ra |nstruco |n|c|a a
def|n|co de uma funco, que cons|ste de um bloco de duas |nstruces. Ns
lt|mas duas |nstruces, que no esto envolv|das por chaves, no so um
bloco e no fazem parte da def|n|co da funco.
|++:t|s+ :s+.s|ts|1|ss ,
// |stss 1+ss |+st|+,|ss sst1s ++m ||s:s.
+s|ss 1|ss ` ,
|st+|+ +s|ss,
//l|m 1s ||s:s.
sNsms "1s1s", // |stss +1s sst1s +s ||s:s.
s|s| "|s|:ss",
Comentrios
Uma n|ca l|nha de comentr|o javaScrit comeca com um par de barras (f
f). Um comentr|o com vr|as l|nhas comeca com uma barra e um aster|sco
(f') e term|na com o |nverso ('f).
s||sss "1s.s:||(t s ls:||.", // |sms+ts||s 1s ||++s.
/`
|sts s
um :sms+ts||s 1s
\s||ss ||++ss.
`/
Atribuices e lguaIdade
O s|nal de |gual () e usado em javaScrit para |nd|car a atr|bu|co de um
valor. Uessa forma uma |nstruco de cd|go javaScrit poder|a ser:
+|+ts||s !,
Isso s|gn|f|ca atr|bua o valor 3 a var|vel nlnteiro" ou nlnteiro recebe o
instrucesintroduco a javascrit
8
valor 3".
Quando queremos comparar do|s valores para saber se so |gua|s, usamos
um par de s|na|s de |gual (). Lm outras palavras, atr|bu|ces e
comparaces possuem s|na|s d|ferentes de |gualdade.
Por exemplo, caso dese[e comparar o valor de duas var|ve|s |nte|ras
nNum1 e nNum2, devemos fazer:
|l | +N+m +N+m ,
s|s|t|"0s ++ms|ss s1s |+s|s'",

s|ss ,
s|s|t|"0s ++ms|ss s1s 1|ls|s+tss'",

Com |sso as var|ve|s sero comparadas e no haver atr|bu|co de valores.


Lsse e um erro bastante comum para os |n|c|antes em javaScrit, portanto
devemos prestar atenco a essa d|ferenca.
variveis em javaScrit
\ar|ve|s so usadas em javaScrit para armazenar valores em seus strIp1s.
Llas so uma forma de obter e man|pular valores usando nomes. Quando
usadas ef|c|entemente, podem a[udar no entend|mento do que um strIp1
faz. Ns var|ve|s em javaScrit func|onam da mesma forma que em
v8Scrit-ASP, como [ estudamos anter|ormente, apenas a s|ntaxe (forma
de escrever as |nstruces) e um pouco d|ferente.
DecIarando variveis
Vesmo que no se[a obr|gatr|o, e cons|derada uma boa prt|ca declarar
var|ve|s antes de us-las. |azemos |sso usando a |nstruco var. O n|co
momento em que prec|samos usar a |nstruco var e quando est|vermos
declarando as var|ve|s loca|s de uma funco. Lm todos os outros casos, o
uso da |nstruco var para declarar var|ve|s antes de us-las e uma prt|ca
apenas rtmndada.
Os segu|ntes exemplos de cd|go so declaraces de var|ve|s:
// 0 .s|s| s|ms/s+s1s s 1s t|(s ts\ts.
.s| s\s|s| "||s|1 u+||s+:s",
// 0 .s|s| s|ms/s+s1s s 1s t|(s |+ts||s.
.s| +\s|s| !,
// 0 .s|s| s|ms/s+s1s s 1s t|(s >A=.
.s| |\s|s| t|+s,
// 0 .s|s| s|ms/s+s1s s 1s t|(s ++ms||:s.
.s| l\s|s| .!||||
variveisintroduco a javascrit
9
Os nomes das variveis
javaScrit e uma l|nguagem tas-snsI1Iv (sensvel a letras ma|sculas e
m|nsculas), dessa mane|ra, nomear uma var|vel como nMeuContador e
d|ferente de nome-la como nMlUContador.
Nlem d|sso, nomes de var|ve|s prec|sam segu|r as segu|ntes regras:
pr|me|ro caracter deve ser uma letra (se[a ma|scula ou m|nscula), um
undrstr (_) ou um s|nal de dlar ($).
os caracteres subseqentes podem ser letras, nmeros, undrstrs ou
s|na|s de dlar.
Lssa d|ferenc|aco entre ma|sculas e m|nsculas fe|ta por javaScrit
tambem e um grande foco de erros de programaco.
lxemIo de verificaco de camos de formuIrio
Ngora que [ conhecemos um pouco da l|nguagem javaScrit, vamos a um
exemplo real que ut|l|zaremos tambem ma|s tarde em nosso sI1 de
vendas.
O exemplo cons|ste na apresentaco de uma pg|na de formulr|o ao
usur|o, com alguns campos a serem preench|dos. Nps o preench|mento,
faremos uma ver|f|caco de campos no preench|dos. Para os campos no
preench|dos, apresentaremos uma mensagem |nformando ao usur|o que
o campo e de preench|mento obr|gatr|o, quando for o caso.
Lxpl|caremos o que so formulr|os e qua|s as suas ut|l|dades em pg|nas
PJVL.
Lsse exemplo e bastante t|l e e ut|l|zado em prat|camente todas as
pg|nas de formulr|o ut|l|zadas na Internet.
O exemplo ut|l|za duas pg|nas:
a pr|me|ra possu| o formulr|o e seus campos para preench|mento,
a segunda e apenas uma pg|na |nd|cando o sucesso do
preench|mento.
Comece abr|ndo o lrontPage lxress e cr|ando a pr|me|ra pg|na com o
formulr|o e os campos que sero preench|dos pelo usur|o. Nbra ento o
lrontPage lxress e selec|one o menu lnserir Camo de formuIrio
8oto de aco. Sua pg|na dever f|car como a da figura 1.
1
lxerccio
exemIo de verificaco de camosintroduco a javascrit
10
Percebemos que uma ca|xa pont|lhada e apresentada com o boto dentro.
Lssa ca|xa pont|lhada del|m|ta um formulr|o, |dent|f|cado na l|nguagem
PJVL pelo comando <lOkM>. Jodos os campos |nser|dos dentro dos
l|m|tes de um formulr|o tero seus contedos env|ados ao serv|dor u
quando o usur|o press|onar o boto Submeter.
Um formulr|o PJVL |nforma qual pg|na ser executada aps a postagem
pelo comando
s:t|s+"+sms_1s_(s|+s.ss("
Um formulr|o deve possu|r um boto do t|po submit. Um boto desse
t|po at|va a postagem", ou se[a, o env|o das |nformaces do formulr|o ao
serv|dor u quando press|onado pelo usur|o.
Npresentamos a segu|r, na l|nguagem PJVL, o comando que representa
um boto do t|po submit.
<|+(+t t,(s"s+|m|t">
Nps o env|o das |nformaces de todos os campos ao serv|dor u e
possvel acessar seus contedos atraves do ob[eto kequest.lorm do ASP,
como veremos ma|s ad|ante, [untamente com as duas |nstruces
mostradas anter|ormente.
Ngora voc |r |nser|r uma ca|xa de texto. Para |sso pos|c|one o cursor
antes do boto Submeter e selec|one o menu lnserir Camo de
lormuIrio Caixa de texto de uma Iinha. \oc dever v|sual|zar a
ligura 1
N pg|na de formulr|o
com o boto de aco.
2
exemIo de verificaco de camosintroduco a javascrit
11
figura 2. O tamanho da ca|xa de texto pode no ser exatamente |gual ao
mostrado na f|gura.
\oc acabou de |ntroduz|r um elemento |mportante para todo formulr|o
PJVL: um dos vr|os t|pos de elementos de entrada de |nformaco. Nesse
caso, uma ca|xa de texto. Ntraves dos elementos de entrada de |nformaco
podemos obter |nformaces d|g|tadas pelo usur|o e anal|s-las poster|or-
mente no serv|dor u. O comando PJVL que representa uma ca|xa de
texto e apresentado a segu|r:
<|+(+t t,(s"ts\t">
U um duplo cl|que sobre a ca|xa de texto que acabou de |nser|r. Na
[anela Proriedades da caixa de texto que se abr|r, preencha o campo
Nome com o valor Quantidade" e cl|que em Ok. Com |sso, demos um
nome a ca|xa de texto. Por me|o dele ser possvel acessar,
poster|ormente, as suas |nformaces.
kep|ta a operaco ad|c|onando ma|s uma ca|xa de texto de nome Obs"
aps a ca|xa de texto Quantidade.
Pos|c|one os controles de forma a de|x-los cada um em uma l|nha e com
o boto Submeter a d|re|ta da ca|xa de texto Obs. U|g|te o nome antes de
cada ca|xa de texto, de forma a fac|l|tar a |dent|f|caco pelo usur|o. Sua
pg|na dever f|car como a da figura 3.
ligura 2
N pg|na com a ca|xa de
texto |nser|da.
4
3
5
verificaco de camos de formuIriointroduco a javascrit
12
\oc agora dar um nome ao formulr|o que acabou de cr|ar. Ntraves
desse nome voc poder acessar os campos do formulr|o a part|r do
cd|go em javaScrit. Para |sso cl|que com o boto d|re|to do mus
dentro da rea que del|m|ta o formulr|o. No menu que aparece,
selec|one a opco Proriedades do formuIrio.
Na [anela Proriedades do formuIrio preencha o campo Nome do
formuIrio com frmComra". Press|one o boto Configuraces e
preencha o campo Aco com Parabens.as. Isso far com que a pg|na
Parabens.as se[a chamada aps se press|onar o boto Submeter.
Preencha o campo Mtodo com POS1 (altere para POS1 caso este[a
POS1Ak). Press|one o boto Ok duas vezes.
Grave a pg|na. Para |sso, selec|one o |tem de menu: Arquivo SaIvar.
Nltere o contedo da ca|xa 1tuIo da gina para: Meu rimeiro
exemIo em javaScrit". Cl|que no boto Como Arquivo..., e salve o
seu trabalho como: MeuPrimeirojavaScrit.as no d|retr|o
c:\inetub\wwwroot.
Ngora vamos para a parte |nteressante: o cd|go em javaScrit. Selec|one
o menu lxibir H1Ml. Uever ser ex|b|da a [anela da figura 4.
ligura 3
N pg|na de formulr|o
completa.
6
9
8
7
verificaco de camos de formuIriointroduco a javascrit
13
Nps o tag <head>, d|g|te o cd|go apresentado no quadro 1. Iremos
mostrar |n|c|almente todo o cd|go e, a segu|r, expl|car cada trecho dele.
<s:||(t |s++ss"1s.s:||(t">
<'
// \s||l|:s ss :sm(ss s|||sts||ss 1s ls|m+|s||s ls|sm (|ss+:+|1ss
l++:t|s+ s+|m|t_(ss|ls|m ,
|l ||sm(s||s+:s|ls|m.0+s+t|1s1s t|+s ,
s|s|t|"\s:s ss|+s:s+ 1s (|ss+:+s| s |+s+t|1s1s.",
ls|m.0+s+t|1s1s.ls:+s|,
|st+|+ ls|ss,

// l|m 1s l++,1s s+|m|t_(ss|


// \s||l|:s ss :sm(s (|ss+:+|1s
l++:t|s+ |sm(s||s+:s|:sm(s ,
|l|:sm(s..s|+s ""
|st+|+ t|+s,
s|ss
|st+|+ ls|ss,

></s:||(t>
\amos agora anal|sar o cd|go que d|g|tamos.
\e[amos a pr|me|ra parte do cd|go:
<s:||(t |s++ss"1s.s:||(t">
ligura 4
[anela de ed|co de PJML
do .HJ2=CA -NFHAII.
10
Quadro 1
Cd|go em javaScrit.
1
Passo a asso
verificaco de camos de formuIriointroduco a javascrit
14
Lla |nd|ca que estamos entrando com um cd|go na l|nguagem javaScrit.
O |deal e |nser|r o cd|go dentro de comentr|os para ev|tar erros nos
navegadores que no suportam [avaScr|pt, como fazemos a segu|r.
<'
Jemos ento a nossa pr|me|ra funco.
// \s||l|:s ss :sm(ss s|||sts||ss 1s ls|m+|s||s ls|sm (|ss+:+|1ss
l++:t|s+ s+|m|t_(ss|ls|m ,
Lla faz a ver|f|caco do preench|mento do campo Quantidade. Caso o
campo do formulr|o no este[a preench|do, apresenta uma mensagem
|nformando o fato, pos|c|ona o cursor no campo com problemas e retorna
o valor faIso. Lm nosso exemplo, apenas o campo Quantidade e de
preench|mento obr|gatr|o.
Para acessar o valor do campo de formulr|o prec|samos ut|l|zar o segu|nte
padro:
nome_do_formuIario.nome_do_camo.vaIue
Isso porque o javaScrit, ass|m como o NSP, e baseado em ob[etos que
tm uma determ|nada h|erarqu|a. Uevemos ento respe|tar essa ordem".
Lm nosso exemplo estamos passando o prpr|o formulr|o como
parmetro a funco chamada. Uessa forma ut|l|zamos form como o nome
do formulr|o dentro de nossa funco. \eremos ma|s ad|ante de onde
nossa funco ser at|vada.
|l ||sm(s||s+:s|ls|m.0+s+t|1s1s t|+s ,
s|s|t|"\s:s ss|+s:s+ 1s (|ss+:+s| s |+s+t|1s1s.",
ls|m.0+s+t|1s1s.ls:+s|,
|st+|+ ls|ss,

// l|m 1s l++,1s s+|m|t_(ss|


N funco Camo8ranco, que ser apresentada ad|ante, ver|f|ca se o campo
passado como parmetro est ou no preench|do. Se est|ver preench|do,
retorna verdadeiro.
Caso o campo no este[a preench|do, o campo dentro do pr|me|ro bloco
de cd|go del|m|tado por ( ) ser executado. N funco aIert de javaScrit
apresenta uma ca|xa de mensagem padro do w|ndows com a mensagem
2
verificaco de camos de formuIriointroduco a javascrit
15
voc esqueceu de reencher a quantidade.".
N segu|r o foco e pos|c|onado sobre o campo de formulr|o Quantidade,
atraves do metodo focus do ob[eto dese[ado.
\amos anal|sar agora como a funco Camo8ranco reconhece se o campo
de formulr|o - passado como parmetro - est ou no preench|do. Isso e
bem s|mples: basta fazer uma comparaco entre o valor do campo de
formulr|o com um texto vaz|o (aspas duplas). Caso a comparaco se[a
verdade|ra, sabemos que o campo no fo| preench|do e retornamos ento
verdadeiro. Isso e apresentado no cd|go a segu|r:
// \s||l|:s ss :sm(s (|ss+:+|1s
l++:t|s+ |sm(s||s+:s|:sm(s ,
|l|:sm(s..s|+s '
|st+|+ t|+s,
s|ss
|st+|+ ls|ss,

||nal|zamos ento nosso trecho de cd|go, fechando o comentr|o e o


bloco javaScrit da segu|nte forma:
></s:||(t>
Ue nada ad|anta escrevermos as funces de ver|f|caco do campo
Quantidade se no as at|varmos em algum lugar. Lm nosso exemplo,
queremos que a ver|f|caco se[a executada quando o usur|o press|onar o
boto Submeter do formulr|o.
Para |sso, a|nda na [anela lxibir ou editar H1Ml do lrontPage lxress,
d|g|te depo|s do texto
<ls|m s:t|s+"|s|s|s+s.ss(" mst+s1"|0" +sms"l|m|sm(|s"
o segu|nte cd|go:
s+s+|m|t'|st+|+ s+|m|t_(ss|t+|s,'
O trecho PJVL, portanto, f|ca com a segu|nte forma:
<ls|m s:t|s+'|s|s|s+s.ss(' mst+s1'|0' +sms'l|m|sm(|s' s+s+|m|t'|st+|+ s+|m|t_(ss|t+|s,'>
N nov|dade aqu| e onsubmit, funco que e executada automat|camente
quando for real|zada a postagem" (env|o) da pg|na ao serv|dor, ou se[a,
quando o usur|o press|onar o boto Submeter. Colocamos ento a
3
verificaco de camos de formuIriointroduco a javascrit
16
chamada a nossa funco submit_age, que retorna o valor verdadeiro ou
faIso. Caso retorne faIso, a pg|na no e env|ada ao serv|dor (ou se[a, a
postagem no e real|zada), obr|gando o usur|o a preencher o campo
dese[ado para dar cont|nu|dade.
Passamos como parmetro a funco submit_age a palavra this. this e
uma palavra reservada da l|nguagem javaScrit que representa sempre o
ob[eto em refernc|a no momento. Lm nosso caso, estamos num
formulr|o, logo o ob[eto formulr|o" e passado a funco submit_age.
Como vemos, atraves de onsubmit e fe|ta a |ntegraco entre o PJVL e o
cd|go em javaScrit. Isso nos fornece grande flex|b|l|dade, po|s
javaScrit na verdade e usado como uma extenso da l|nguagem PJVL,
ou se[a, torna-se possvel a execuco de pequenos trechos de programa no
navegador do usur|o.
No Quadro 2 e apresentado o cd|go completo da pg|na
MeuPrimeirojavaScrit.as.
<+tm|>
<+ss1>
<msts +tt(s|+|."|s+ts+t,(s" :s+ts+t"ts\t/+tm|, :+s|sst|ss|||J">
<msts +sms"u|N|||0|" :s+ts+t"||:|ssslt ||s+t|ss |\(|sss .'">
<t|t|s>|s+ (||ms||s s\sm(|s sm 1s.s:||(t</t|t|s>
</+ss1>
<|s1, |:s|s|"/||||||">
<s:||(t |s++ss"1s.s:||(t">
<'
// \s||l|:s ss :sm(ss s|||sts||ss 1s ls|m+|s||s ls|sm (|ss+:+|1ss
l++:t|s+ s+|m|t_(ss|ls|m ,
|l ||sm(s||s+:s|ls|m.0+s+t|1s1s t|+s ,
s|s|t|"\s:s ss|+s:s+ 1s (|ss+:+s| s |+s+t|1s1s.",
ls|m.0+s+t|1s1s.ls:+s|,
|st+|+ ls|ss,

// l|m 1s l++,1s s+|m|t_(ss|


// \s||l|:s ss :sm(s (|ss+:+|1s
l++:t|s+ |sm(s||s+:s|:sm(s ,
|l|:sm(s..s|+s ""
|st+|+ t|+s,
s|ss
Quadro 2
O cd|go completo de
nossa pg|na.
verificaco de camos de formuIriointroduco a javascrit
17
|st+|+ ls|ss,

></s:||(t>
<ls|m s:t|s+"(s|s|s+s.ss(" mst+s1"|0" +sms"l|m|sm(|s"
s+s+|m|t"|st+|+ s+|m|t_(ss|t+|s,">
<(>0+s+t|1s1s. <|+(+t t,(s"ts\t" s|/s"'" +sms"0+s+t|1s1s"></(>
<(>0|s. <|+(+t t,(s"ts\t" s|/s"'" +sms"s|s"><|+(+t t,(s"s+|m|t" +sms"|"
.s|+s"+|msts|"></(>
</ls|m>
</|s1,>
</+tm|>
\amos agora completar o nosso pequeno s|stema de entrada de
|nformaces:
|eche a [anela lditar ou lxibir H1Ml do lrontPage lxress e grave a
pg|na.
Ngora voc |r cr|ar uma outra pg|na bem s|mples, somente para
apresentar uma mensagem de sucesso caso o usur|o preencha
corretamente o campo de formulr|o Quantidade. Para |sso cr|e uma nova
pg|na de ttulo Parabens!" e d|g|te no contedo dela o texto \oc
preencheu corretamente o formulr|o". Salve essa pg|na com o nome
Parabens.as no d|retr|o c:\inetub\wwwroot. O quadro 3 apresenta o
cd|go PJVL completo dessa pg|na.
<+tm|>
<+ss1>
<msts +tt(s|+|."|s+ts+t,(s" :s+ts+t"ts\t/+tm|, :+s|sst|ss|||J">
<msts +sms"u|N|||0|" :s+ts+t"||:|ssslt ||s+t|ss |\(|sss .'">
<t|t|s>|s|s|s+s'</t|t|s>
</+ss1>
<|s1, |:s|s|"/||||||">
<(>\s:s (|ss+:+s+ :s||stsms+ts s ls|m+|s||s</(>
</|s1,>
</+tm|>
\amos agora testar nossa pg|na. Para |sso abra o lnternet lxIorer e
d|g|te o endereco htt://IocaIhost/MeuPrimeirojavaScrit.as. Nps a
Quadro 2
O cd|go completo de
nossa pg|na.
lxerccio
1
2
Quadro 3
O cd|go completo da
pg|na Parabens.asp.
verificaco de camos de formuIriointroduco a javascrit
18
apresentaco da pg|na, press|one o boto Submeter sem preencher o
campo de formulr|o Quantidade. Ser apresentada uma mensagem
|nformando a necess|dade de preench|mento desse campo. Preencha
ento o campo e press|one novamente o boto Submeter: ser
apresentada a pg|na Parabens.as.
Parabens! \oc escreveu sua pr|me|ra pg|na em javaScrit!
verificaco de camos de formuIriointroduco a javascrit

Você também pode gostar