formulario e javascript (1)

Download Formulario e JavaScript (1)

Post on 27-Dec-2015

28 views

Category:

Documents

0 download

Embed Size (px)

TRANSCRIPT

  • HTML - Formulrios

  • Ambiente Grfico ou Visual

    Objetos

    Propriedades Eventos Mtodos

  • HTML - Formulrios

    Os formulrios permitem dotar uma pgina web de elementos interativos

    os quais possibilitam um dilogo com usurio da internet .

    Os formulrios so definidos por meio das etiquetas e .

    Entre estas duas etiquetas pode-se colocar objetos de formulrio que

    sero vistos a seguir.

    A marcao tem os seguintes atributos.:

    ...

  • HTML - Formulrios

    Caixa de Texto e Propriedades

    Exemplo:

    Endereo:

    Endereo: Seu endereo

  • Caixa de Texto tipo Senha e Propriedades

    Exemplo:

    Senha:

    Senha:

    HTML - Formulrios

  • HTML - FormulriosMltipla escolha e Propriedades

    Exemplo:

    Esporte(s) que pratica:

    Futebol

    Vlei

    Basquete

    Natao

    Esporte(s) que pratica: Futebol Vlei Basquete Natao

  • HTML - Formulrios

    nica Escolha e Propriedades

    O agrupamento de opes do boto RADIO feita atravs da

    propriedade NAME.

    Exemplo:

    Reside em:

    Casa trrea

    Apartamento

    Sobrado

    Reside em:

  • HTML - Formulrios

    Botes de Ao e Propriedades

    Boto SUBMIT causa o envio dos dados de entrada para o servidor e para

    outra pgina. Trabalha em conjunto com a marcao FORM e parmetro

    ACTION:

    Exemplo:

    Enviar dados

  • HTML - Formulrios

    Botes de Ao e Propriedades

    Boto RESET restaura os valores iniciais das entradas de dados.

    Exemplo:

    Restaura pgina

  • HTML - Formulrios

    Botes de Ao e Propriedades

    Boto do tipo BUTTON no tm comportamento pr-definido, sendo

    usados apenas em scripts no lado cliente.

    .

    Exemplo:

    Calcular

  • uma imagem que age como boto submit.

  • HTML - Formulrios

    Caixa de Seleo e Propriedades

    texto

    ...

    texto

    Analista de Sistemas

    Analista de Segurana

    Analista de Negcios

    Administrador de BD

    Administrador de Redes

    Programador

  • HTML - Formulrios

    Caixa de Seleo e Propriedades

    Analista de Sistemas

    Analista de Segurana

    Analista de Negcios

    Administrador de BD

    Administrador de Redes

    Programador

  • HTML - Formulrios

    Caixa de Seleo e Propriedades

    Analista de NegciosAdministrador de BD

    Administrador de Redes

    Programador

  • -- Escolha uma funo --

    Analista de Sistemas

    Analista de Segurana

    Analista de Negcios

    Administrador de BD

    Administrador de Redes

    Programador

    HTML - Formulrios

    Caixa de Seleo e Propriedades

  • HTML - Formulrios

    rea de Texto e Propriedades

    O controle TEXTAREA um campo de texto multi-linha. Os atributos rows e cols

    definem o nmero de linhas de altura e o de "caracteres" de largura,

    respectivamente.

  • HTML - FormulriosAplicao Cadastro de Alunos

  • HTML - FormulriosAplicao Cadastro de Alunos - Cdigo

    Faculdade Sabetudo

    Cadastro de Alunos

    Matrcula:

    Nome:

    Curso:

    --- Escolha um dos cursos ---

    Anlise de Sistemas

    Gerenciamento de Redes

    Segurana da Informao

    Banco de Dados

    Sistemas para Internet

    Gerenciamento de Projetos

    Login:

    Senha:

    Perodo:

    Diurno

    Noturno

    Idioma(s) (bsico):

    Ingls

    Espanhol

    Francs

    Alemo

    Observaes:

  • Desenvolvida pela NETSCAPE, a linguagem

    JavaScript foi criada para trabalhar com aplicaes

    interativas nas pginas HTML.

    Javascript uma extenso do HTML (Linguagem

    de Marcao de Hipertexto), os comandos JavaScript

    so embutidos nas pginas HTML e interpretados pelo

    browser, ou seja, o JavaScript no possui nenhum

    procedimento de compilao e como tal, utilizada

    tambm para controlar dinamicamente o comportamento

    de objetos nas pginas.

  • Javascript compatvel com os principais

    navegadores em uso atualmente (IE, Mozila Firefox,

    Chrome, Opera e Safari). Porm, devido a constantes

    atualizaes e lanamento de novas verses

    altamente recomendvel que se faa testes nos mais

    diversos browsers antes de disponibilizar uma aplicao

    na WEB.

    COMPATIBILIDADE ENTRE NAVEGADORES

  • Processamento de Dados

    Conceitos Gerais

    Entrada Processamento Sada

    Dados Transformao Informao

    Operaes aritmticas (+, -, /, *) atribuio =Operaes relacionais (, ==, !=, >=,

  • Nomes de Variveis ou Constantes

    Faz diferena entre nomes de variveis com letras minsculas e maisculas:

    Exemplo: Peso peso

    iniciar com letras:

    Seguidos de letras, nmeros ou trao baixo

    peso = 80.5;

    Declarao:

    Local: var peso = 80.5;

    Global: peso = 80.5;

    no podemos definir um identificador com o mesmo nome que uma palavra chave

    If While Var For End

    JavaScriptVariveis / Constantes

    Espao de memria de um certo tipo de dadoassociado a um nome para referenciar seu contedo.

  • JavaScript

    Tipos de Dados

    Tipo Contedo(s)

    Boleano True ou False

    Numrico -

    inteiro ou

    ponto flutuante

    (real)

    Contedos numricos inteiros ou com casas

    decimais.

    Literal (String) Contedos alfanumricos (caracteres

    alfabticos, numricos e especiais (#, @, $,

    etc.)

  • Funo Valor Retornado

    parseInt() Nmero Inteiro

    parseFloat() Nmero de Ponto

    flutuante ou Real

    eval() Resultado de

    clculos com literais

    (2 + 2)

    JavaScript

    Funes de Converso (string para numrico)

  • Entrada Processamento Sada

    Dados Transformao Informao

    Comandos de Entrada, Processamento e Sada

    varivel = operaes aritmticas;

    JavaScript

  • JavaScript

    Operadores Aritmticos

    Operador Operao

    * Multiplicao

    / Diviso

    + Adio

    - Subtrao

    % Resto

    ( ) Alterao de

    prioridade

  • Ambiente Grfico ou Visual

    Objetos

    Propriedades Eventos Mtodos

  • EVENTO MANIPULADOR DESCRIO

    blur onBlur Ocorre quando o usurio retira o foco de um objeto

    de formulrio.

    change onChange Ocorre quando o usurio muda o valor de um objeto

    de formulrio.

    click onClick Ocorre quando o usurio clica sobre o objeto

    focus onFocus Ocorre quando o usurio focaliza o objeto.

    load onLoad Ocorre quando o usurio carrega a pgina.

    unload onUnload Ocorre quando o usurio abandona a pgina.

    mouseOver onMouseOver Ocorre quando o ponteiro do mouse passa sobre um

    link ou ncora. Vlidos apenas para hiperlinks.

    select onSelect Ocorre quando o usurio seleciona um elemento de

    um formulrio.

    JavaScript - Eventos

  • EVENTO MANIPULADOR DESCRIO

    submit onSubmit Ocorre quando o usurio envia um formulrio.

    mouseDown onMouseDown Ocorre quando o boto do mouse pressionado.

    mouseMove onMouseMove Ocorre quando o ponteiro do mouse se movimenta

    sobre o objeto.

    mouseOut onMouseOut Ocorre quando o ponteiro do mouse afasta de um

    objeto. Vlidos apenas para hiperlinks.

    mouseUp onMouseUp Ocorre quando o boto do mouse solto.

    keyDown onKeyDown Ocorre quando uma tecla segurada.

    keyPress onKeyPress Ocorre quando uma tecla pressionada.

    keyUp onKeyUp Ocorre quando uma tecla solta.

    JavaScript - Eventos

  • Os mtodos so funes associadas aos objetos. Um objeto pode assim ser definido

    em termos de propriedades, no s pelas suas variveis, mas tambm pelos mtodos que tiver

    associados, que permitem no s realizar aes sobre as propriedades prprias do objeto, como

    tambm outros tipos de operaes diversas.

    Objetos integrados no JavaScript

    O JavaScript incorpora, uma srie de objetos que permitem realizar as tarefas mais importantes

    que se esperam realizar com esta linguagem.

    Relativamente aos objetos que podem ser utilizados em scripts JavaScript, dividem-se em quatro

    tipos:

    Objectos para operaes com Strings

    Permitem efetuar vrias operaes com texto e sequncias de caracteres.

    Operaes matemticas

    Implementam as operaes matemticas correntes.

    Data e Hora

    Esta famlia de objetos permite realizar operaes com datas e horas.

    Objetos relacionados com o browser

    Permitem vrias operaes e manipulaes ao nvel do browser Web.

    Mtodos

    JavaScript

  • Mtodos - Strings

    Propriedade:length

    Comprimento da string (nmero de caracteres)

    Mtodos:charAt(posio)

    Devolve o carcter localizado na posio indicada da String de texto.

    slice(inicio,fim)

    Define um pedao de uma string entre as posies incio e fim.

    substr(inicio,comp)

    Define uma substring, a partir de incio e com o tamanho comp".

    toLowerCase()

    Devolve uma String com todos os caracteres convertidos para minsculas.

    toUpperCase()

    Idem, mas convertendo todos os caracteres para maisculas.

    JavaScript

  • Mtodos - Formatao

    toLocaleString() - converte dados para formato local.Obs.: resultado varia de navegador e

    no implementado no Google Chrome.

    var nr = 25321.86;

    alert(Valor: + nr.toLocaleString());

    toFixed(nmero de casas decimais)

    var data = new Date();

    alert("Hoje : " + data.toLocaleString());

    var nr = 25321.12352;

    alert(Valor: + nr.toFixed(3));

    JavaScript

  • Operaes Matemticas

    As operaes matemticas podem ser realizadas tambm por meio do objeto "Math".

    Mtodos:

    abs(nmero)