{controls na internet}

2.1 FORM TAGS Quem j trabalhou com Visual Basic ou Delphi conhece bem o uso dos "controls", aquelas coisas que aparecem na interface do programa para o usurio entrar com dados,labels etc. Na interface da Internet (que o browser) temos as FORM TAGS no lugar dos controls. claro que no temos um control como o Label, pois podemos colocar textos de forma mais simples com o HTML. Vamos ver os equivalentes aos outros controls.

2.2 EDIT BOX

O EditBox serve principalmente para entrada de dados como strings, quando a quantidade entrada no muita. Para colocar um EditBox numa pgina usamos: &ltINPUT TYPE="TEXT" NAME="nome da varivel que recebe o que for entrado" SIZE=largura da janela MAXLENGTH=quantidade de caracteres entrados vlidos VALUE="texto default"> Os trs ltimos parmetros so opcionais.

A largura dada por SIZE numa medida maluca - o tamanho mdio dos caracteres da fonte que voc est usando. O que no igual a quantidade de caracteres. Com a letra "x" d mais ou menos certo. Repare no exemplo abaixo que foi definido assim: &ltINPUT TYPE="TEXT" NAME="numtel" SIZE=10>

Tente entrar com dados nele.A quantidade de caracteres entrados vlidos infinita.Cuidado com isso. sempre melhor definir uma MAXLENGTH mesmo que seja maior que o SIZE. Veja outro exemplo.Nesse o tamanho diferente e vem com um texto que pode ser substituido.

&ltINPUT TYPE="TEXT" NAME="ender" SIZE=30 MAXLENGTH=30 VALUE="(aqui seu endereo)">

(aqui seu endereo)

Repare que se voc for entrando com texto, no 30 caractere voc interrompido e toca o beep.Se voc entrou com "x" aparecem os 30; com "m" aparecem uns 16. aquela unidade maluca de que falamos. Mas aparecer no significa que s o que aparece "inputado",claro? De qualquer maneira coloque os EditBox sempre com SIZE maior que MAXLENGTH para o cliente no ficar confuso. No existe maneira fcil de (apenas com HTML) colocar o cursor dentro dum EditBox nem de faz-lo ir pulando de um para outro.Mas daqui a pouco inventam, espero. Pode-se usar o VALUE para tornar o EditBox um campo de output, por programa.

2.3 UM EDIT BOX PROTEGIDO? Tente digitar algo nesse EditBox a de baixo.

Este um Edit Box protegido que serve para entrada de password, por exemplo.Agora, ele s protegido de algum que esteja fungando no seu cangote (pa!) porque pela linha at o servidor vai circular o que for digitado. De qualquer maneira pode ser usado para dar a impresso de algo muito seguro para clientes inseguros. A forma semelhante a anterior: &ltINPUT TYPE="PASSWORD" NAME="nome da varivel que recebe o que for entrado" SIZE=largura da janela MAXLENGTH=quantidade de caracteres entrados vlidos VALUE="texto default">

2.4 TEXT AREA Para entrar ou mostrar maior quantidade de texto existe o control TextArea. A forma assim: &ltTEXTAREA COLS=largura da janela ROWS=altura da janela WRAP="virtual ou phisical - veja explicao abaixo" NAME="nome da varivel que recebe o que for entrado"> linha-de-texto

linha-de-texto </TEXTAREA> Primeiro vai a nossa crtica relativa a inconsistncia de termos. No lugar de SIZE temos COLS que faz muita gente pensar em colunas - no nada disso.Depois o texto no entra em VALUE mas em linhas colocadas entre a abertura e fechamento da definio do control. No entanto o que o cliente entrar vai como valor da varivel definida em NAME. Veja abaixo uma explicao sobre WRAP:

Nesse TEXTAREA, WRAP foi definido como "virtual".Voc entrando com texto existe quebra automtica de linha. Quando o que voc entrou for transmitido como contedo de uma varivel,no sero includos automticamente "scapes" de <FONT FACE="Courier New,Courier">J neste caso o WRAP foi definido como "phisical". Tudo parece igual mas sero incluidos "scapes" de quebra de linha na transmisso. Neste caso no usamos WRAP na definio. O que voc digitar no vai ter quebra automtica de linha. Voc vai ter que faz-la. J o texto que aparece tem as quebras
A altura dada em ROWS no equivale bem ao nmero de linhas ( brincadeira!, como diria o Gerson).

2.5 LIST BOX ListBoxes so aquelas listas nas quais voc pode escolher uma opo. um control que tambm tem abertura e fechamento na definio. Assim: &ltSELECT SIZE=altura da janela

NAME="nome da varivel que recebe o que est na linha selecionada"> &ltOPTION&gtPrimeira Opo &ltOPTION SELECTED&gtOpo default &ltOPTION&gtTerceira Opo &ltOPTION VALUE="string que vai para a varivel no lugar da linha"&gtQuarta Opo </SELECT> S mais uma crtica:SIZE agora define altura - e, por incrvel que parea, bate com a quantidade de linhas que aparecem (o pessoal que definiu esse negcio deve tomar todas...) Se voc definir SIZE como 1 Temos um ListBox "abrvel". No existe o equivalente ao ComboBox (em que se pode entrar com uma nova seleo. Veja exemplos (que no levam a nada):

Selecione o melhor time do Brasil:

Grmio Santos Flamengo

Agora com SIZE=1. Selecione o melhor estado do Brasil:

Minas Gerais

2.6 RADIO BUTTONS Os Botes de Rdio andam sempre juntos (como turistas japoneses). Voc s pode selecionar um do grupo. Cada um deles deve ser definido assim: &ltINPUT TYPE="RADIO" NAME="nome da varivel que recebe o VALUE selecionado" VALUE="o que vai para a varivel" CHECKED>texto que aparece O NAME deve ser o mesmo para todos os Botes.

O "texto que aparece" pode ser ou no igual ao VALUE. A palavra CHECKED opcional e s pode estar em um Boto do grupo. Um exemplo: Selecione o maior:

j k l m n Ali Baba n Al Capone n PC j k l m i j k l m

2.7 CHECK BOX Vamos esclarecer uma coisa importante. Cada control tem um NAME e voc preenche ou assinala qualquer coisa nele.sse valor assinalado enviado para o programa que est no servidor quando voc aperta um Boto (que vamos ver num prximo captulo). Esse envio feito sempre como uma DUPLA em que vai o NAME e o valor entrado. Por exemplo:se um Edit Box tem o NAME "tel" e voc entra com:295-8643, ser enviado para o programa a DUPLA: tel=295-8643 Voltando aos CheckBoxes, eles tambm andam em grupos.Mas voc pode assinalar VRIOS deles (ao contrrio dos Botes de Rdio) Os CheckBoxes podem ou no ter o mesmo NAME. S so enviados para o programa os ChekBoxes assinalados.Se tiverem o mesmo NAME vo vrias DUPLAS com o mesmo primeiro valor e valores diferentes na segunda parte.Seu programa deve administar essa coisa meio confusa. Cada CheckBox definido assim: &ltINPUT TYPE="CHECKBOX" NAME="nome da varivel que recebe o VALUE, se for checado" VALUE="o que vai para a varivel" CHECKED>texto que aparece A palavra CHECKED opcional e o "texto que aparece" pode ou no ser igual ao VALUE. Mais um exemplo idiota: Assinale as pessoas que te do teso:

b c d e f g Sharon Stone

c d e f g Maguila c d e f g Ney Matogrosso b c d e f g Carla Perez

Nas prximas aulas vamos ver como ligar os controls com seu programa PERL que est no servidor fazendo assim a entrada de dados via Internet.