Este artigo orienta o estudante na elaboração de um formulário de entrada de dados usando métodos de programação em linguagem PHP e HTML, procurando estabelecer, de forma sintética, os principais pontos para o desenvolvimento de classes e telas. Neste sentido, descreve-se seqüencialmente, os sucessivos passos para a construção de um formulário de cadastro completo, porem simples.

PALAVRAS-CHAVE: Classe. Objeto. PHP. HTML. Produtos. Cadastro. Formulário. Entrada de dados 1. INTRODUÇÃO Para os iniciantes em PHP, este artigo deve fazer parte do seu material de trabalho, pois se trata de como desenvolver um formulário para entrada de dados com PHP e HTML trabalhando juntos. O formulário será o local onde o usuário digitará os dados que deseja salvar no banco de dados, desta forma o designer deve ser o mais intuitivo possível. No nosso exemplo usaremos como banco de dados o MYSQL e como servidor WEB o Apache, pois ambos são gratuitos. Na internet existem algumas ferramentas que nos auxiliam neste processo de configuração de servidores WEB e banco de dados. Nós usaremos o XAMPP para economizar esforços em configurações de servidores. Lembrando que após instalá-lo, será necessário deixar iniciado o Apache e o MYSQL no momento dos testes. 1. Use algum editor de pagina como o FrontPage para poder criar uma pagina de entrada de dados para o cadastro de produtos. Para desenhar siga os passos conforme as telas abaixo: 2. Estrutura de pasta dentro doc:\xampp\htdocs\exercicio13. Estrutura de pasta para arquivos classe:c:\xampp\htdocs\exercicio1\class

O que é um formulário?

Um formulário em um site é semelhante em conceito a um formulário em papel, exceto se você o cria online e o usa para interagir e reunir informações de visitantes do site. Geralmente, os visitantes do site inserem informações (também conhecidas como 'valores') em campos de formulário e indicam suas preferências clicando em botões de opção, caixas de seleção e caixas suspensas. Os visitantes do site também podem digitar comentários em caixas de texto ou áreas de texto. Ao abrir o FrontPage, uma pagina em branco será aberta com o nome de nova_pagina_1.htm. Vamos inserir um formulário nesta pagina. Acesse o menu Inserir>>Formulário>>Formulário.

Figura 1
Será inserida uma área demarcada com dois botões, conforme imagem abaixo:

Figura 2
Posicione o cursor no início do botão e então, pressione a tecla algumas vezes para que um espaço seja liberado.

Figura 3
Vamos configurar o formulário inserido, para isso, pressione o botão direito do mouse em uma área em branco dentro do formulário e escolha a opção “Propriedade do formulário...”

Figura 4
Na tela de Propriedade do formulário marque a opção “Enviar para outro” e no nome do formulário digite: form1 então clique no botão “Opções...”

Figura 5
Abrirá a tela para inserirmos as configurações do formulário, preencha o campo Ação: produto.php e clique em OK

Figura 6
Retorne para a tela principal, repare que os códigos foram alterados de acordo com a configuração realizada.

Figura 7
Clique com o botão direito do mouse sobre o botão e clique em “Propriedades do campo de formulário”

Figura 8
Altere o “Valor/rótulo:” para Cadastrar.

Figura 9
Insira na área em branco do formulário uma tabela 2x2.

Figura 10
Preencha a tabela com a primeira linha da primeira coluna “Código Barra” e a segunda linha da primeira coluna com “Produto”, conforme imagem abaixo:

Figura 11
Para cada elemento que queira no formulário, posicione o cursor dentro deste, escolha no menu Inserir a opção Formulário, e escolha, do menu resultante, o tipo de elemento a inserir, neste caso “Caixa de Texto” em frente aos campos correspondentes.

Figura 12
Como resultado uma “Caixa de Texto” será inserida no formulário dentro da tabela.

Figura 13
Insira mais uma caixa de texto na lacuna do Produto.

Figura 14
Como resultado ficará uma caixa de texto para cada linha, conforme abaixo:

Figura 15
Precisamos configurar os nomes das caixas de texto para que reconheçamos como variáveis no PHP. Assumiremos os nomes conforme a tabela de produtos (codigo_barra,produto). Clique com o botão direito do mouse sobre a primeira caixa de texto e escolha “Propriedades do campo de formulário”

Figura 16
Na tela de propriedade da caixa de texto defina o nome da primeira caixa como codigo_barra e pressione OK.

Figura 17
Faça o mesmo para a segunda caixa de texto.

Figura 18
Desta vez defina o nome como produto e clique em OK.

Figura 19
Salve o arquivo atual, clique no menu arquivo >> Salvar.

Figura 20
Escolha o diretório htdocs no caso de usarmos o xampp como servidor de pagina. Crie uma pasta chamada exercicio1 dentro de htdocs

Figura 21
Defina o nome da pasta como exercicio1

Figura 22
No nome do arquivo digite: produto.htm e clique em Salvar.

Figura 23
O que é XAMPP ?
XAMPP é um servidor independente de plataforma, software livre, que consiste principalmente na base de dados MySQL, o servidor web Apache e os interpretadores para linguagens de script: PHP e Perl. O nome provem da abreviação de X (para qualquer dos diferentes sistemas operativos), Apache, MySQL, PHP, Perl. Verifique se o servidor Apache está ativo conforme tela abaixo e abra a tela de configuração do phpMyAdmin no botão Admin...

Figura 24
A pagina abaixo abrirá com a tela de do SGDB do mysql, conhecido com phpMyAdmin.

Figura 25
Na tela principal bem no centro, no título “Criar novo Banco de Dados” digite Estoque para que possamos criar um novo banco de dados e clique em “Criar”.

Figura 26
Em caso de sucesso, uma mensagem com fundo verde surgirá ou em caso de erros o erro será informado. Observe se o banco de dados já não existe.

Figura 27
Para criarmos uma nova tabela no banco de dados, na tela principal abaixo procure pelo rótulo “Criar nova tabela no Banco de Dados”. No campo Nome defina como produtos e nonúmero de arquivosque é o mesmo quecolunasescolha 3, então clique no botão executar.

Figura 28
Preencha a tela conforme abaixo: · cod_produto do tipo int marque o índice para PRIMARY. · codigo_barra do tipo varchar(13) marque a opção Nulo. · produto do tipo varchar(80) marque a opção Nulo. Clique no botãoSALVAR.

Figura 29
Como resultado será mostrado à mensagem em inglês que a tabela foi criada com sucesso!

Figura 30

Em algum editor PHP, como o NetBeans crie os arquivos conforme conteúdo respectivo abaixo:

conexao.class.php > save no diretório class da pasta exercicio1.

Produto.class.php > save no diretório class da pasta exercicio1.

produto.php > save no diretório exercicio1 antes da pasta class.

Listagem conexao.class.php

<?php
  //Define o nome da classe a ser criada, no nosso caso Conexao
  class Conexao
  {
        //Abaixo as respectivas variaveis para cada atributo de nossa classe
          var $usuario                 = "root";
          var $senha    = "";
          var $hostname             = "localhost";
          var $banco    = "estoque";

          //Dois atributos extras, um para guardar o comando sql e outro para guardar o link conexao
         var $link         = "";

    //Definir método setConectar, tem a função de executar os códigos para conexao ao banco de dados
    function setConectar()
                {
                //Faz a conexao com ao banco e armazena na variavel this->link
                $this->link = mysql_pconnect($this->hostname,$this->usuario,$this->senha) or die (mysql_error());
        //Seleciona o banco a ser usado no mysql
                               mysql_select_db($this->banco, $this->link);
                }
  }
?>

Listagem Produto.class.php

<?php
class Produto{
    //include_once("conexao.class.php");
    //declaracao de variaveis publicas e privadas
    public $cod_produto;
    public $codigo_barra;
    public $produto;

    // Metodo construtor setamos aqui o que queremos que ele faça ao criar o objeto
    function __construct(){
                //inclue a classe conexao se não estiver incluida
                include_once("conexao.class.php");
        //criamos a nossa conexao com o banco de dados e selecionamos o banco
                    //Criar uma variavel para armazer a instancia(objeto) da classee conexao
                               $oConexao = new Conexao();
                               //Executar o metodo setConectar da classe Conexao
                               $oConexao->setConectar();
        echo "Conectado.<br>";
    }
    function setProduto(){
        //realiza o insert no banco de dados passando os valores do objeto criado
        $insertProdutos = mysql_query("insert into produtos values(NULL ,"$this->codigo_barra","$this->produto")");
        echo "Inserido.<br>";
    }
}
?>
 

Listagem produto.php


<?php
        include_once("class/Produto.class.php");

        //Criando e Instanciando o objeto
        $oProduto               = new Produto;
        //Atribuindo valores ao objeto
        $oProduto->codigo_barra = $_POST["codigo_barra"];
        $oProduto->produto      = $_POST["produto"];
        //chamando a funcao que faz o insert
        $oProduto->setProduto();
        echo "Produto ". $_POST["produto"] . " cadastrado com sucesso!";
?>

Para efetuar o teste, acesse o link a seguir no browser http://localhost/exercicio1/produto.htm.

O formulário para entrada de dados de produtos será aberto, preencha-o com dados fictícios e clique no botão cadastrar.

Acesse o banco de dados para verificar se foi incluído registro preenchido no formulário à tabela.

CONCLUSÃO

Para realizar o cadastro de um produto, é necessário unir várias técnicas dispostas em diversas disciplinas distintas, assim como banco de dados, web designer, web máster, linguagem PHP, linguagem HTML, Classes, Objetos, Paradigma de Programação Orientada a Objeto. Para seguir na área de programação, o indivíduo deve ter interesse por várias áreas de conhecimento no seguimento, pois para realizar um simples cadastro de produtos, unirmos várias tecnologias. Para listar os produtos já cadastrados, é necessário criar mais um método na classe Produtos, isso poderá ser visto no próximo artigo.

REFERÊNCIAS

Melo, Ana Cristina. Desenvolvendo Aplicações com UML, 1 º Edição, Brasport, 2002.

Melo, Ana Cristina. Desenvolvimento aplicações com UML 2.0: do conceitual à implementação / Ana Cristina Melo. – 2. Ed. – Rio de Janeiro : Brasport, 2004.