material 6 - tecnologias web
DESCRIPTION
Material 6 - Tecnologias WEBTRANSCRIPT
HTML – FORMULÁRIO(continuação…)
Lado servidor (server‐side)<!DOCTYPE html><html lang="pt‐br"><head><meta charset="iso‐8859‐1"><title>Enviar dados</title>
</head><body><form method="post" action="gravar.php"><font face="Helvetica"><label for="data">DATA:</label> <input type="date" name="data"><p>NOME: <input name="nome" type="text" id="nome"></p><p>CIDADE/ESTADO: <input name="cidade" type="text" id="cidade"></p><p>MENSAGEM:</p><p> <textarea name="mensagem" rows="5" id="mensagem"></textarea> </p><p> <input type="submit" name="Submit" value="Enviar"> </p></font></form>
</body></html>
EXEMPLO:Neste exemplo vamos enviar e salvar osdados do formulário em um arquivochamado “arquivo.txt”. Primeirocriaremos o formulário e salvaremos como nome “formp.html”. Depois criaremos oarquivo “gravar.php” aonde os dadosserão tratados e salvos no “arquivo.txt”.
Arquivo: formp.html
Lado servidor (server‐side)
EXEMPLO:Salve este código com o nome: gravar.php
<?php//PEGA OS DADOS ENVIADOS PELO FORMULÁRIO $data = $_POST["data"];$nome = $_POST["nome"]; $cidade = $_POST["cidade"]; $mensagem = $_POST["mensagem"];
//PREPARA O CONTEÚDO A SER GRAVADO $conteudo ="Data: $data Nome: $nome Cidade: $cidade Mensagem: $mensagem\r\n";
//ARQUIVO TXT $arquivo = "arquivo.txt";
//TENTA ABRIR O ARQUIVO TXT if (!$abrir = fopen($arquivo, "a")) { echo "Erro abrindo arquivo ($arquivo)"; exit; }
Arquivo: gravar.php
Lado servidor (server‐side)
//ESCREVE NO ARQUIVO TXT if (!fwrite($abrir, $conteudo)) { print "Erro escrevendo no arquivo ($arquivo)"; exit; }
echo "Informações enviadas e gravadas com sucesso !!!<br><br>";
//FECHA O ARQUIVO fclose($abrir); ?><a href="http://localhost:81/projects/formp.html">Clique aqui para voltar</a>
EXEMPLO:Continuação do slide anterior...
Continuação do arquivo: gravar.php
Lado servidor (server‐side)Os arquivos criados agora devem ficar na seguinte pasta:
No navegador coloca‐se: localhost:81/projects/. Aparecerá a tela a seguir.
Lado servidor (server‐side)Agora clique no arquivo indicado pela seta “formp.html “
para carregá‐lo:
Lado servidor (server‐side)Carregado o arquivo
“formp.html “ vamos preencher os campos do formulário e enviar
os dados para testá‐lo.
Com os campos preenchidos clique no botão “Enviar”
Lado servidor (server‐side)Após ter clicado no botão “Enviar” aparecerá a seguinte tela informando que a operação foi realizada com sucesso, e que se quiser retornar para a tela inicial, é só clicar no link indicado abaixo “Clique aqui para voltar”.
No diretório aonde estão os arquivos “formp.html” e “gravar.php” estará também o “arquivo.txt” com as informações gravadas do formulário, conforme mostra a
figura a seguir.
Lado servidor (server‐side)Clicando no “arquivo.txt” pode‐se verificar as informações digitadas e enviadas foram gravadas corretamente no arquivo como mostrado na figura a seguir.
Basicamente como ocorre o tratamento dos dados no formulário?
● Primeiramente, a página com o formulário é carregada.● Após o preenchimento do formulário, o javascript valida os campos que são
obrigatórios.● Caso estejam preenchidos, envia os dados dos campos para um servidor
tratar as informações.● Caso campos obrigatórios estejam em branco, emitir uma mensagem de
erro.● Após o javascript validar os campos, os dados do formulário são enviados
para o servidor que irá tratá‐los.● A tarefa de tratar os dados consta na verificação se os campos obrigatórios
foram validados, se os valores esperados foram informados,armazenamento dos dados no banco de dados, etc...
● Após o tratamento dos dados, as informações são armazenadas no banco dedados e uma mensagem de confirmação é retornada pelo servidor.
● Continua o processo normalmente .....
Exemplo de formulário ‐ HTML