Aplicativos em PHP/Editores e IDEs para PHP, CSS, JavaScript e HTML/Dreamweaver

Origem: Wikilivros, livros abertos por um mundo aberto.
Saltar para a navegação Saltar para a pesquisa

Dreamweaver[editar | editar código-fonte]

IDE muito popular entre os designers e com suporte ao PHP, inclusive também gera código. Site oficial

Versão comercial para Windows e MAC.

Dreamweaver 8 is the industry-leading web development tool, enabling users to efficiently design, develop and maintain standards-based websites and web applications.


Gerando Código PHP com MySQL Através do Dreamweaver

Com o Dreamweaver iremos gerar praticamente todo o código de uma aplicação, a conexão, inclusão, consultas, autenticação de usuários, etc. Criaremos uma aplicação web para cadastro e manutenção de clientes de uma empresa. Para simplificar criaremos apenas as telas referentes aos clientes, supondo que os administradores são mantidos através de um gerenciador do banco.

1) CRIAÇÃO DO BANCO cad_clientes NO MYSQL

CREATE TABLE `administrador` (
  `login` varchar(8) NOT NULL,
  `senha` varchar (8) NOT NULL,  
  `nome` varchar(40) NOT NULL,
  PRIMARY KEY  (`login`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

CREATE TABLE cliente (
  codigo int(11) NOT NULL auto_increment,
  nome varchar(40) NOT NULL,
  login varchar(12) NOT NULL,
  senha varchar(12) NOT NULL,
  email varchar(40) default NULL,
  login_adm varchar(8) NOT NULL,
  UNIQUE KEY login (login),
  PRIMARY KEY  (codigo),
  FOREIGN KEY (login_adm) REFERENCES administrador (login) ON UPDATE CASCADE
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

Observações Importantes:

  1. Observe que a tabela administrador tem todas as variáveis (nomes de tabela e campos) cercada por delimitadores e que estes delimitadores são sinais de crase e não apóstrofos. Veja que o uso das crases é opcional, pois a tabela clientes não os utiliza e ambas as sintaxes são aceitas.
  2. Para que tabelas em MySQL tenham suporte a relacionamentos, elas obrigatoriamente devem ser do tipo InnoDB (ENGINE=InnoDB ou TYPE=INNODB)
  3. Para dar suporte a acentuação usamos "DEFAULT CHARSET=latin1"

Comandos úteis do MySQL:

SHOW TABLES - Exibe tabelas do banco atual

SHOW DATABASES - exibe todos os bancos

DESCRIBE nometabela - mostra estrutura da tabela


2) DEFINIR UM SITE NO DW

Ao definir um site sempre prefira que as pastas locais e remotas sejam a mesma, para o caso de estar trabalhando localmente (apache e php na sua máquina). Ao final enviar para o servidor por FTP.

3) DEFINIR UM OBJETO CONEXAO

Ao definir uma conexão com o banco MySQL, teremos um objeto conexão com um nome que batizamos e este objeto estará disponível por todo o site.

  1. Tecle Ctrl+N e Selecione General - Dynamic page - PHP e Create
  2. Tecle Ctrl+S para salvar (index.php)
  3. Clique no painel Application - Databases (à direita).

Dw1.png

Então clique no sinal de + (mais) e em MySQL Connection

Dw2.png

Então preencha assim:

Dw3.png

- Connection name - conexao
- MySQL server - 127.0.0.1 (caso esteja utilizando remotamente aqui entre com o IP do servidor remoto)
- User name - root (mude se for o seu caso, deixando "" caso não tenha senha)
- Password - sua senha
- Database - cad_clientes (idealmente clique no botão select para escolher)
- Agora clique no botão Test para ver como ficou. Se tudo bem clique em OK.
- Observe que a conexão agora ganhou um ícone à direita em Databases. Se clicar no sinal de + verá os objetos do banco.
- Para remover uma conexão basta selecionar e clicar no botão com o sinal de - (menos)

Veja que no arquivo atual estando no modo Design não percebemos nada do objeto conexão criado. Mas o DW cria algumas sub-pastas na pasta do nosso site atual, contendo os códigos que irá utilizar em todo o aplicativo. Na pasta Connection está o arquivo conexao.php, que contém o seguinte código:

<?php
# FileName="Connection_php_mysql.htm"
# Type="MYSQL"
# HTTP="true"
$hostname_conexao = "127.0.0.1";
$database_conexao = "cad_clientes";
$username_conexao = "root";
$password_conexao = "phpsenha";
$conexao = mysql_pconnect($hostname_conexao, $username_conexao, $password_conexao) or trigger_error(mysql_error(),E_USER_ERROR); 
?>

Este código é um código simples de uma conexão em PHP com MySQL, mas quando já tiver dado os primeiros passos em PHP e também no PHP voltado ao objeto e quiser ir mais adiante estude o código do arquivo mysql.php da pasta _mmServerScripts.


4) DEFINIR O ARQUIVO DE AUTENTICAÇÃO DO USUÁRIO

Este código exige que criemos um formulário de login com os campos login e senha. Ele redireciona o usuário devidamente autenticado para um arquivo (menu.php no nosso caso) e o não autenticado para outro (index.php).

- Ainda com o arquivo index.php aberto e no modo DESIGN faça...
- No painel Properties abaixo clique em Centralizar e Format Heading 2
- Então digite "Autenticação do Usuário" então tecle Enter
- Crie um form contendo apenas dois campos texto login e senha e um botão (Acessar). 	
- Os nomes dos campos devem ser "login" e "senha"
- O campo senha do tipo password.
- Os campos devem ter size (char width) 9 e maxlength (maschar) 8


Dw4.png


Dw5.png


  1. Agora usaremos o assistente do DW para gerar o código de autenticação:
  2. Selecione a barra de ferramentas Application (acima)
  3. Clique na seta ao lado do botão User authentication (último da barra)
  4. Selecione "Log in user"


Dw6.png

Então preencha o assistente como abaixo:

Dw7.png


  1. Validate using connection - Selecione "conexão"
  2. Table - administrador
  3. Username column - login
  4. Password column - senha
  5. If login suceeds, go to - menu.php
  6. If login fails, go to - index.php e marque também Go to previous URL
  7. Restrict access based on - Username and password. A opção abaixo é indicada para quando temos diversos administradores com diversos níveis de acesso: um acessa tudo, outro acessa somente parte, ...

Com isto também não vemos nada no modo Design, mas ao observar o modo Code vemos o código inserido pelo DW:

<?php require_once('Connections/conexao.php'); ?>
<?php
// *** Validate request to login to this site.
session_start();
$loginFormAction = $_SERVER['PHP_SELF'];
if (isset($accesscheck)) {
  $GLOBALS['PrevUrl'] = $accesscheck;
  session_register('PrevUrl');
}

if (isset($_POST['login'])) {
  $loginUsername=$_POST['login'];
  $password=$_POST['senha'];
  $MM_fldUserAuthorization = "";
  $MM_redirectLoginSuccess = "menu.php";
  $MM_redirectLoginFailed = "index.php";
  $MM_redirecttoReferrer = true;
  mysql_select_db($database_conexao, $conexao);
  
  $LoginRS__query=sprintf("SELECT login, senha FROM administrador WHERE login='%s' AND senha='%s'",
    get_magic_quotes_gpc() ? $loginUsername : addslashes($loginUsername), get_magic_quotes_gpc() ? $password : addslashes($password)); 
   
  $LoginRS = mysql_query($LoginRS__query, $conexao) or die(mysql_error());
  $loginFoundUser = mysql_num_rows($LoginRS);
  if ($loginFoundUser) {
     $loginStrGroup = "";
    
    //declare two session variables and assign them
    $GLOBALS['MM_Username'] = $loginUsername;
    $GLOBALS['MM_UserGroup'] = $loginStrGroup;	      

    //register the session variables
    session_register("MM_Username");
    session_register("MM_UserGroup");

    if (isset($_SESSION['PrevUrl']) && true) {
      $MM_redirectLoginSuccess = $_SESSION['PrevUrl'];	
    }
    header("Location: " . $MM_redirectLoginSuccess );
  }
  else {
    header("Location: ". $MM_redirectLoginFailed );
  }
}
?>

Um código organizado e com muita coisa para se aprender.

5) CRIAÇÃO DO MENU DE ACESSO

Este arquivo não terá código do DW, apenas será o menu de acesso às demais seções do site e conterá um form com uma caixa de texto (login) e cinco botões como abaixo:

Dw8.png


Consultar Um, Consultar Todos, Cadastrar, Atualizar e Excluir. Os botões darão acesso às demais seções do site.

  • O form terá o método POST, action ="" e cada botão terá código JS como abaixo ao final da tag <input ..> respoinsável pelo redirecionamento para a página solicitada:
<input name="btnConsultar1" type="submit" id="btnConsultar3" value="Consultar Um" onClick="form1.action='consultar1.php';form1.submit()">    
<input name="btnConsultar2" type="submit" id="btnConsultar2" value="Consultar Todos" onClick="form1.action='consultart.php';form1.submit()">
<input name="btnCadastrar" type="submit" id="btnCadastrar" value="Cadastrar" onClick="form1.action='cadastrar.php';form1.submit()">
<input name="btnAtualizar" type="submit" id="btnAtualizar" value="Atualizar" onClick="form1.action='atualizar.php';form1.submit()">
<input name="btnExcluir" type="submit" id="btnExcluir" value="Excluir" onClick="form1.action='excluir.php';form1.submit()">  

TESTE DO SITE

Já podemos testar o site criado até o momento.

Abra no DW a página index.php e tecle F12 para abrir no site web.

Entre com login e senha que cadastrou no banco e clique em Acessar ou apenas tecle Enter. Veja que se realmente entrou com dados que estão no banco, tabela administrador, você será redirecionado para menu.php, caso contrário para index.php.


6) CRIAÇÃO DA SEÇÃO DE CONSULTA (UM ÚNICO CLIENTE)

- Criar um novo arquivo (consultar1.php, que servirá para consultar um único usuário).

No modo Design, centralizado digite no Format Heading2 "Consultar um Clientes" então tecle Enter.

CRIAÇÃO DE UMOBJETO RECORDSET

  • À direita clique no painel Application – Bindings


Dw9.png


  • Clique no sinal de mais (+) e em Recordset (Query) para inserir um objeto Consulta:

Dw10.png


Name: rsConsCli1

Connection: conexao (selecionar ou criar em Define)

Table: cliente (selecionar)

Columns: All

Filter: login e = Form Variable – login (Para o caso de método GET usar URL variable)

Sort: nome Ascending

Ao clicar em em Test não receberá retorno satisfatório, pois a variável vinda do form está vazia. Clique em OK para concluir.

Com isso não aconteceu nada visível no nosso arquivo mas temos agora um objeto contendo o código de uma consulta que poderá ser utilizada somente neste arquivo.

Após definir um Recordset ele fica disponível em Application – Bindings. Mesmo que não estejamos vendo nada de novo no modo Design, no modo Code podemos ver todo o seu código inserido pelo DW. Como também podemos inserir qualquer um dos campos do Recordset no nosso documento, basta clicar em seu sinal de + à direita e ele mostra todos os seus campos. Então clique em qualquer campo e arraste para o documento. Então o DW insere o código PHP correspondente a introdução do campo já referenciado pelo Recordeset.

Veja o código do Recordset inserido no arquivo atual:

<?php require_once('Connections/conexao.php'); ?>
<?php
$colname_rsConCli1 = "1";
if (isset($_POST['login'])) {
  $colname_rsConCli1 = (get_magic_quotes_gpc()) ? $_POST['login'] : addslashes($_POST['login']);
}
mysql_select_db($database_conexao, $conexao);
$query_rsConCli1 = sprintf("SELECT * FROM cliente WHERE login = '%s' ORDER BY nome ASC", $colname_rsConCli1);
$rsConCli1 = mysql_query($query_rsConCli1, $conexao) or die(mysql_error());
$row_rsConCli1 = mysql_fetch_assoc($rsConCli1);
$totalRows_rsConCli1 = mysql_num_rows($rsConCli1);
?>

INSERIR UMA DYNAMIC TABLE

Agora que temos o nosso recordset vamos inserir o resultado da consulta iniciada quando o usuário clica no botão Consulta Um.

Clique na seta ao lado do botão Dynamic Date e clique em Dynamic Table:


Dw11.png

Então preencha os dados do assistente:

Dw12.png


Recordset – selecione o nosso REcordset criado rsConCli1

Show - 10 registros por vez

Border – 1 (para que a tabela exiba bordas)

Então teremos algo como:

Dw13.png

7) CRIAÇÃO DA SEÇÃO DE CONSULTA (TODOS OS CLIENTES)

Vamos agora criar o arquivo consultart.php.

Vamos adicionar um Recordset com nome rsConCliT. Este Recordset receberá todos os registros da tabela sem nenhum filtro, apenas ordenados pelo nome:

Dw14.png


Vamos também adicionar uma Dynamic Table tendo como base o rsConCliT:

Dw15.png


INSERINDO PAGINAÇÃO DE RESULTADOS

Vamos também inserir uma paginação de resultados, pois agora moderemos ter uma grande quantidade de registros. A paginação controla a exibição dos regitros, onde selecionamos quantos registros queremos exibir de cada vez e ainda oferece links para navegar entre os registros existentes: próximos, primeiros, últimos, anteriores.

Deixe o cursor abaixo da tabela criada e clique na seta ao lado do botão Recordset Paging e clique em Recordset Navigation Bar:


Dw16.png

Quando verá:


Dw17.png

Apenas selecione Images e clique em OK.

Podemos deixar o resultado maia elegante centralizando a tabela criada pelo Dynamic Table: deixe o cursor do mouse abaixo da tabela até aparecer a seta e clique na tabela. Quando perceber toda a tabela estiver selecionada então aparece nas propriedades abaixo a opção Align (selecione Center e salve).

Outra sugestão é setar a propriedade Alt de todas as quatro imagens da paginação com: Primeiro, Próximo, Anterior e Último. Basta selecionar a imagem e setar abaixo na propriedade.

8) CRIAÇÃO DA SEÇÃO DE CADASTRO

Para a seção de cadastro (insert) não requer criação de Recordset nem de Formulário.

  • Clique na seta ao lado do botão Insert Record

Dw18.png

E clique em Record Insertion Form Wizard preenchendo como sugerido abaixo:

Dw19.png

Veja que removi o campo código, que é preenchido pelo próprio MySQL.


9) CRIAÇÃO DA SEÇÃO DE ATUALIZAÇÃO

Este assistente exige que criemos apenas um recordset e depois ele criará o formulário de atualização.

  1. Crie um novo arquivo atualizar.php
  2. Em Heading 2 e centralizado digite “Atualização de Clientes” e tecle Enter
  3. Clique na seta ao lado do botão Update Record e clique em Record Update Form Wizard


Dw20.png

Então aparece um diálogo exibindo as exigências do assistente, no caso ainda resta criar um Recordset:


Dw21.png

Clique no link Recordset para criar um agora e crie de acordo com os dados abaixo:


Dw22.png

Para testar será exigido um login de cliente cadastrado.

Clique em OK para criar e confirme OK no diálogo Setup Instructions.

Então será aberto o assistente de criação do form de atualização.

Record Update Form


Dw23.png


Observe que removemos o campo código, já que este sempre será mantido pelo próprio MySQL (auto increment).

Outro detalhe é a página para onde será redirecionado após a atualização. Caso no site se faça muitas atualizações de cada vez o ideal seria voltar para a própria página atualizar.php.

Em casos de grande sigilo podemos alterar o tipo de exibição da senha para Password em Display as.

Altere o botão para "Atualizar Registro".

10) CRIAÇÃO DA SEÇÃO DE EXCLUSÃO

Esta também exige a criação de um Recordset e também cria automaticamente o form.

Como este assistente é somente código não requer que digitemos nenhum título. Após a exclusão ele voltará para a página menu.php.

  • Clique no botão Delete Record


Dw24.png

Então entre com as devidas informações nno assistente:


Dw25.png

11) CRIAÇÃO DE UMA SEÇÃO MASTER/DETAILS

Este assistente cria uma página onde podemos ter uma página exibindo uma grande relação de registros e com apenas poucos campos. Um destes campos contém um link que abre uma segunda página contendo mais detalhes sobre o registro selecionado.

  1. Crie um arquivo novo chamado marterdet.php.
  2. Com o arquivo aberto crie um novo Recordset para exibir todos os campos da tabela cliente.
  3. Clique no botão Master Detail Page Set

Dw26.png

Agora complete de acordo com a captura abaixo:

Dw27.png

Observe que deixei apenas dois campos para a página master e na detail todos os campos. O DW criará automaticamente a página detail.php indicada e ainda adiciona paginação ao resultado.

Antes de testar abra a página detail.php e salve.

12) ADICIONANDO O TOTAL DE REGISTROS A UMA PÁGINA

  1. Após ter criado uma página que exibe diversos registros, então jogue o foco onde deseja exibir o total de registros e digite algo como “Total de Clientes Cadastrados: “
  2. Clique na seta do botão Display Records Count e clique em Total Records

Dw28.png

Agora selecione o Recordset

Dw29.png

E clique em OK

Ficando assim: Total de Clientes Cadastrados: {rsConCliT.TotalRecords}

Se verificar vai constatar que existem diversos outros recursos de geração de código do DW.

13) ADICIONAR SELECT DINÂMICO A CAMPO DE FORMULÁRIO

Podemos adicionar um select que vai a outra tabela e é preenchido com valores da mesma e armazena na tabela atual.

  1. Selecione o campo onde deseja adicionar o select dinâmico e remova o campo texto (login_adm) do cadastrar.php
  2. Em seu lugar insira um elemento do formulário List/Menu.
  3. Mude seu nome para login_adm.
  4. Crie um Recordset contendo toda a tabela administrador.
  5. Selecione o select e abaixo clique no botão Dynamic deixando assim:

Dw30.png

Então clique no botão Select value equal to e selecione nome e OK:

Dw31.png

Prontinho, temos agora um select dinâmico.