Como Criar um Sistema de Cadastro: Parte 2

Apresentação

Olá, pessoal

Como o prometido, vamos dar continuidade ao Sistema de Cadastro, iniciado no tutorial anterior. Caso não tenha visto, recomendo que o faça antes de seguir neste: Como Criar um Sistema de Cadastro: Parte 1

Pré-Requisitos

1. Facilidade quanto a manuseio do Dreamweaver e a manipulação de formulários
2. Ter feito o tutorial anterior: Como Criar um Sistema de Cadastro: Parte 1
3. Ter criado uma conta gratuita no servidor 000webhost.com

Objetivos

1. Criar um sistema de cadastro básico utilizando o Dreamweaver, PHP e Banco de Dados
2. Criar um formulário que envie os dados para o servidor web
3. Criar uma página para exibir a relação de cadastrados no sistema

Conteúdo

1º Passo – Criando a página formulario_cadastro.php

Vamos criar uma página PHP e nomeá-la como formulario_cadastro.php. Para isso, acessemos o menu File > New (CTRL+N) e selecionemos a opção PHP, clicando em Create em seguida.

Os dados serão cadastrados nesta página que acabamos de criá-la e nela conterá um formulário e todo o processo para enviarmos o que digitarmos em seus campos, para o banco de dados, mais especificamente, na tabela cadastro.

2º Passo – Desenvolvendo o Formulário de Cadastro

Existe um recurso no Dreamweaver chamado Record Insertion Form Wizard e, através dele, de uma só vez, criaremos o formulário e os códigos PHP. Acessemos então no painel Insert, aba Data, a opção Insert record > Record Insertion Form Wizard

Fig. 01 - Insert Recordset Form Wizard

Na tela seguinte, surgem as opções de configuração do formulário e seus campos de preenchimento:

Fig. 02 - Janela Record Insertion Form

Fig. 03 - Label NOME.

Fig. 04 - Label EMAIL

Preenchido e configurados os pontos, é só clicar em OK e teremos o seguinte resultado:

Fig. 05 - Formulário de cadastro

Lembram dos pré-requisitos para fazerem este tutorial? Pois então, supondo que tenham conhecimentos básicos sobre formulários, apresentarei o resultado final da inserção de um cabeçalho para ele e a mudança do nome do botão.

Fig. 06 - Formatação do formulário

3º Passo – Envio do Arquivo para o Servidor

Nosso formulário de cadastro está pronto, agora é só enviá-lo para o servidor.

Como o FTP foi configurado no tutorial passado, basta clicarmos sobre o arquivo formulario_cadastro.php, no painel Files e clicar em Put File(s).

Fig. 07 - Envio de arquivos via FTP

4º Passo – Criação da Página de Confirmação de Envio

Lembram que no momento da inserção do formulário, definimos que a página de redirecionamento após o envio dos dados a qual colocamos lá foi a cadastro_ok.php?

Então, vamos criá-la e inserir um link que levará o usuário a visualizar todos os cadastros efetuados, ok?! Para isso, acessemos o menu File > New e escolhamos o tipo de página PHP.

Criemos uma página simples, apenas para podermos visualizar seu resultado e criemos um link chamado: Veja todos os cadastros e com a url cadastros.php.

Fig. 08 - Confirmação de envio.

5º Passo – Criando a Página de Exibição de Cadastros

Pessoal, a página que exibirá a relação de todos os cadastros enviados para o banco de dados, será chamado de cadastros.php. Com a página já criada e salva, trabalharemos com outro recurso do Dreamweaver chamado Recordset (conjunto de registros).

Então, acessemos o painel Bindings > Sinal de “+” > Recordset (Query):

Fig. 09 - Recordset

E, realizando as devidas configurações a seguir…

Fig. 10 - Painel Recordset

… poderemos visualizar o seguinte resultado:

Fig. 11 - Recordsets campos

Bom, estamos quase lá

Para ficar organizado, criemos uma tabela (CTRL+ALT+T) com 2 linhas e 3 colunas, com largura de 700 px:

Fig. 12 - Tabela de relatório

Fazendo algumas configurações, ela ficará assim:

Fig. 13 - Tabela de relatório

Dando prosseguimento, vamos clicar nos “Recordsets” e arrastá-los para dentro da tabela, sob seus respectivos títulos:

Fig.14 - Configuração da tabela

Da maneira que está aqui, já podemos visualizar o último cadastro inserido no banco de dados, mas o ideal é que visualizemos alguns ou até mesmo todos. Para isso, devemos SELECIONAR a linha inteira onde estão os recordsets e acessar o painel Insert > Data > Repeat Region:

Fig. 15 - Repetição de dados

Feito isso, nossa página está pronta.

Veja abaixo:

É isso aí, pessoal.

Espero que tenham gostado.

Até a próxima.

CarlosHPS Webdesigner