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

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. 02 - Janela Record Insertion Form

Fig. 03 - Label NOME.

Fig. 03 - Label NOME.

Fig. 04 - Label EMAIL

Fig. 04 - Label EMAIL

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

Fig. 05 - Formulário de cadastro

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

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

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.

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

Fig. 09 - Recordset

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

Fig. 10 - Painel Recordset

Fig. 10 - Painel Recordset

… poderemos visualizar o seguinte resultado:

Fig. 11 - Recordsets campos

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

Fig. 12 - Tabela de relatório

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

Fig. 13 - Tabela de relatório

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

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

Fig. 15 - Repetição de dados

Feito isso, nossa página está pronta.

Veja abaixo:

http://www.carloshps.com.br/blog/como-criar-um-sistema-de-cadastro-parte-2/

É isso aí, pessoal.

Espero que tenham gostado.

Até a próxima.

CarlosHPS Webdesigner 8)

Autor: CarlosHPS Webdesigner – Colunista Dreamweaver do Portal MXSTUDIO

Não deixem de me fazer uma visita em meu blog – www.carloshps.com.br/blog e ao meu portfólio – www.carloshps.com.br/portfolio

Escrito por CarlosHPS Webdesigner on março 14, 2009. Arquivado em Dreamweaver, PHP. Você pode seguir as respostas a esse artigo pelo RSS 2.0. Você pode deixar respostas para esse artigo

6 respostas a Como Criar um Sistema de Cadastro: Parte 2

  1. Legal…em explicado…obrigada.

  2. Vlw pela segunda parte ^^_^

  3. bom, apesar de que não gosto do dreamweaver

  4. eu gostaria de coloca uma pagena de cadrastro no meusite obrigado

  5. Maycon Tavares

    Legal, gostei deste tutorial, só gostaria de saber, como criar esse mesmo tipo de formulário, mas com os usuários criando senha e tudo mais, e cada um tendo seu tipo de restrição! É muito complicado?

  6. Maycon Tavares

    Up!

Deixe uma resposta

O seu endereço de email não será publicado Campos obrigatórios são marcados *

*

Você pode usar estas tags e atributos de HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>