O documento descreve como criar os arquivos de template header e footer para reutilização em todo o projeto PHP/MySQL. Também cria uma página inicial com links para as funcionalidades do sistema de cadastro de clientes, como gerenciamento e cadastro de novos clientes.
1. Passo 1: Crie o Banco de Dados e a Tabela
de Clientes
Fonte: http://webdevacademy.com.br/tutoriais/crud-bootstrap-php-mysql-parte1/
A maior parte dos sistemas em PHP é feito com um banco de dados no back end, e
normalmente, esse banco de dados é o MySQL. Por isso, é importante criar essa
camada de acesso a dados de uma forma bem genérica e independente, para que
depois ela possa ser reaproveitada em todo o sistema.
Neste tutorial, você vai ver como deve ser esse banco de dados para o nosso sistema
de CRUD e como criá-lo, executando o SQL pelo phpMyAdmin. Depois disso, vamos
criar um arquivo de configurações para usar em todo o sistema. E ,por fim, vamos criar
o script de conexão com esse banco de dados, usando PHP.
Ao final, você vai ter uma estrutura inicial do banco de dados para o nosso CRUD, e a
tabela de clientes vazia, além dos arquivos iniciais do projeto.
Antes de Começar
Eu vou assumir que você já está com o seu ambiente de desenvolvimento
funcionando.
Aqui, nós vamos utilizar o XAMPP, que já traz o PHP, o MySQL (ou MariaDB), e o
phpMyAdmin para manipular o banco de dados.
Se você ainda não estiver com o ambiente pronto, é só ver a introdução desta série e
instalar os pré-requisitos.
2. Passo 1: Crie o Banco de Dados e a Tabela
de Clientes
Para este tutorial, vamos criar um banco de dados bem simples, com uma tabela de
clientes apenas.
Eu vou usar aqueles campos de clientes que são usados em notas fiscais para criar
essa tabela, e assim ela vai servir de exemplo para um cadastro de clientes bem
genérico.
O mapeamento das colunas da tabela de clientes ficou assim:
Clientes (codigo, nome, cpf/cnpj, data de nascimento,
endereço, bairro, cep, cidade, estado,
telefone, celular, inscrição estadual,
data de cadastro, data de atualização)
Uma boa prática, que eu sempre recomendo, é você traduzir os nomes de tabelas e os
campos para o inglês, e a partir daí criar seu banco de dados. Isso facilita muito na
hora de escrever as consultas, e na hora de escrever o código do sistema. Você ainda
acaba aprendendo um pouco mais do idioma.
Então, nós vamos ter os seguintes campos:
customers
PK id int
name varchar
cpf_cnpj varchar
birthdate date
address varchar
3. hood varchar
zip_code int
city varchar
state varchar
phone int
mobile int
ie int
created datetime
modified datetime
E, convertendo tudo isso em SQL, fica assim:
CREATE TABLE customers (
id int(11) NOT NULL,
name varchar(255) NOT NULL,
cpf_cnpj varchar(14) NOT NULL,
birthdate date NOT NULL,
address varchar(255) NOT NULL,
hood varchar(100) NOT NULL,
zip_code int(8) NOT NULL,
city varchar(100) NOT NULL,
state varchar(100) NOT NULL,
4. phone int(13) NOT NULL,
mobile int(13) NOT NULL,
ie int(11) NOT NULL,
created datetime NOT NULL,
modified datetime NOT NULL
);
ALTER TABLE customers
ADD PRIMARY KEY (id);
ALTER TABLE customers
MODIFY id int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=1;
view rawcrud-bootstrap.sql hosted with by GitHub
Agora, abra o phpMyAdmin do XAMPP e crie um banco de dados. Eu coloquei o nome
como wda_crud.
Se preferir, pode fazer via SQL direto (na aba SQL, do phpMyAdmin):
:
CREATE DATABASE wda_crud;
Depois que criar, use o SQL acima para criar a tabela ‘customers‘ nesse banco de
dados.
Passo 2: Crie o Arquivo de Configurações do
Sistema
Agora, vamos criar um arquivo de configurações, que vai guardar todos os dados que
vão ser usados em todos os outros scritps PHP do sistema.
Crie um arquivo chamado config.php, na pasta principal, e coloque o código a seguir:
<?php
/** O nome do banco de dados*/
define('DB_NAME', 'wda_crud');
/** Usuário do banco de dados MySQL */
5. define('DB_USER', 'root');
/** Senha do banco de dados MySQL */
define('DB_PASSWORD', '');
/** nome do host do MySQL */
define('DB_HOST', 'localhost');
/** caminho absoluto para a pasta do sistema **/
if ( !defined('ABSPATH') )
define('ABSPATH', dirname(__FILE__) . '/');
/** caminho no server para o sistema **/
if ( !defined('BASEURL') )
define('BASEURL', '/crud-bootstrap-php/');
/** caminho do arquivo de banco de dados **/
if ( !defined('DBAPI') )
define('DBAPI', ABSPATH . 'inc/database.php');
view rawconfig.php hosted with by GitHub
Este arquivo de configurações é baseado no wp-config do WordPress.
Os quatro primeiros itens são as constantes que vão guardar as credenciais para
acessar o banco de dados:
o DB_NAME define o nome do seu banco de dados;
o DB_USER é o usuário para acessar o banco de dados;
o DB_PASSWORD é a senha deste usuário (no XAMPP, este usuário root não
tem senha);
e o DB_HOST é endereço do servidor do banco de dados;
Você deve modificar esses valores de acordo com o seu ambiente de
desenvolvimento, ou de produção.
Além dessas constantes, temos mais duas outras que são muito importantes:
O ABSPATH, na linha 17, define o caminho absoluto da pasta deste webapp no
sistema de arquivos.
Ela vai ser usada para chamar os outros arquivos e templates via PHP (usando
o include_once), já que ela guarda o caminho físico da pasta.
E o BASEURL, na linha 21, define o caminho deste webapp no servidor web.
6. Esse valor deve ser igual ao nome da pasta que você criou no começo do projeto. Ela
será usada para montar os links da aplicação, já que ela guarda a URL inicial.
Depois, nós vamos adicionar mais itens neste arquivo de configurações. Por enquanto,
esses aí são suficientes para conectar com o banco.
Você pode criar outros itens próprios, também, se precisar.
Passo 3: Implemente o script de Conexão
com o Banco de Dados
Vamos criar um arquivo que vai ter todas as funções de acesso ao banco de dados.
Assim, podemos reaproveitar código nas outras partes do CRUD.
Crie um arquivo chamado database.php, na pasta inc do seu projeto, e coloque o
código a seguir:
<?php
mysqli_report(MYSQLI_REPORT_STRICT);
function open_database() {
try {
$conn = new mysqli(DB_HOST, DB_USER, DB_PASSWORD, DB_NAME);
return $conn;
} catch (Exception $e) {
echo $e->getMessage();
return null;
}
}
function close_database($conn) {
try {
mysqli_close($conn);
} catch (Exception $e) {
echo $e->getMessage();
}
}
view rawdatabase.php hosted with by GitHub
7. Este será um arquivo de funções do banco de dados. Tudo que for relativo ao BD
estará nele.
Vamos entender esses códigos…
Primeiramente, na linha 3, configuramos o MySQL para avisar sobre erros graves,
usando a função mysqli_report(). Depois, temos duas funções.
A primeira função – open_database() – abre a conexão com a base de dados, e
retorna a conexão realizada, se der tudo certo. Se houver algum erro, a função dispara
uma exceção, que pode ser exibida ao usuário.
Já a segunda função – close_database($conn) – fecha a conexão que for passada.
Se houver qualquer erro, a função dispara uma exceção, também.
Observe as constantes sendo
usadas (DB_HOST, DB_USER, DB_PASSWORD, DB_NAME). Dessa forma, caso
você mude de servidor ou de BD, basta alterar o arquivo de
configurações; sem precisar mexer no código principal.
Passo 4: Teste a Conexão
Agora sim, vamos ver se o banco de dados está conectado ao CRUD.
Crie um arquivo chamado index.php, na pasta principal, e coloque o código a seguir:
<?php require_once 'config.php'; ?>
<?php require_once DBAPI; ?>
<?php
$db = open_database();
if ($db) {
echo '<h1>Banco de Dados Conectado!</h1>';
} else {
echo '<h1>ERRO: Não foi possível Conectar!</h1>';
}
?>
view rawindex.php hosted with by GitHub
Para entender, rapidamente:
8. Primeiro, adicionamos o arquivo de configurações e o arquivo de funções do banco de
dados (ou API de Banco de Dados), usando o require_once.
Depois, usamos a função para abrir a conexão. E, então, é feito um teste para saber
se a conexão existe: if ($db) …
Vamos ver se funciona… Acesse o CRUD pelo navegador:
http://localhost/crud-bootstrap-php
Se aparecer a mensagem ‘Banco de Dados Conectado!‘, sua conexão está OK.
Senão, verifique
se o MySQL está iniciado e verifique se as credenciais estão
corretas (DB_HOST, DB_USER, DB_PASSWORD, DB_NAME). Qualquer item errado
causa falha na conexão.
Até aqui, seu projeto deve estar assim:
crud-bootstrap-php
css
fonts
inc
database.php
js
config.php
index.php
Sempre que você for fazer um sistema com PHP, ou até mesmo um site, você
deve pensar em reaproveitamento de código. Ao fazer isso você aumenta sua
produtividade, e evita gerar bugs. O ideal é que você use templates e funções
sempre que possível.
Neste tutorial, você vai ver como criar os arquivos de template do cabeçalho
(header) e do rodapé (footer) para usar em todo o projeto. Depois disso, vamos
criar uma página inicial com os botões de acesso para as funcionalidades do
sistema.
9. Ao final deste tutorial, você vai ter uma estrutura básica de templates para reaproveitar
no projeto e, também, a página inicial que vai servir como dashboard, onde o usuário
vai poder acessar as funcionalidades do sistema, e do CRUD.
Antes de Começar
Eu vou assumir que você já está com o seu ambiente de desenvolvimento
funcionando, e que já criou o banco de dados do CRUD.
Se você ainda não estiver com o ambiente pronto, é só ver a introdução desta
série para instalar os pré-requisitos, e criar o BD.
Passo 1: Crie o Template do Header
Primeiro de tudo, crie um arquivo chamado header.php na pasta /inc do seu projeto.
Depois coloque esta marcação:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>CRUD com Bootstrap</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
11. <li><a href="<?php echo BASEURL; ?>customers/add.php">Novo Cliente</a></li>
</ul>
</li>
</ul>
</div><!--/.navbar-collapse -->
</div>
</nav>
<main class="container">
view rawheader.php hosted with by GitHub
Bastante coisa, né?!
O que essa marcação faz é o definir inicio de um página HTML básica, já usando o
Bootstrap. E, também, vamos usar o Font Awesome, que é uma biblioteca de ícones,
para os nossos botões.
Observe que em várias linhas tem o seguinte comando:
<?php echo BASEURL; ?>
Você deve se lembrar que a constante BASEURL foi definida no config.php, certo?!
Sempre que você for montar um link, você deve usar essa constante, já que ela guarda
o endereço correto dessa nossa aplicação web no servidor.
Esse header também cria um menu (a partir da linha 22), que ficará no topo da página.
Eu até adicionei dois links para os futuros “módulos” do CRUD:
<li><a href="<?php echo BASEURL; ?>customers">Gerenciar
Clientes</a></li>
<li><a href="<?php echo BASEURL; ?>customers/add.php">Novo
Cliente</a></li>
Essas páginas ainda não existem. Vamos criar nos próximos tutoriais. Mas já deixe os
links aí, esperando pelo código do “módulo de clientes”.
Passo 2: Crie o Template do Footer
Agora, crie um arquivo chamado footer.php na pasta /inc do seu projeto. E coloque
esta marcação:
13. /** O nome do banco de dados*/
define('DB_NAME', 'wda_crud');
/** Usuário do banco de dados MySQL */
define('DB_USER', 'root');
/** Senha do banco de dados MySQL */
define('DB_PASSWORD', '');
/** nome do host do MySQL */
define('DB_HOST', 'localhost');
/** caminho absoluto para a pasta do sistema **/
if ( !defined('ABSPATH') )
define('ABSPATH', dirname(__FILE__) . '/');
/** caminho no server para o sistema **/
if ( !defined('BASEURL') )
define('BASEURL', '/crud-bootstrap/');
/** caminho do arquivo de banco de dados **/
if ( !defined('DBAPI') )
define('DBAPI', ABSPATH . 'inc/database.php');
/** caminhos dos templates de header e footer **/
define('HEADER_TEMPLATE', ABSPATH . 'inc/header.php');
define('FOOTER_TEMPLATE', ABSPATH . 'inc/footer.php');
view rawconfig.php hosted with by GitHub
A partir daqui, sempre que você criar uma página nova, você pode usar essas
constantes HEADER_TEMPLATE e FOOTER_TEMPLATE para importar o topo e o
final da página.
Isso evita muito a repetição de código, e economizará seu tempo e esforço.
Lembre-se que para usar esses templates, você precisará sempre requisitar
o config.php, usando a função require_once.
Vamos ver isso no próximo passo…
14. Passo 4: Crie a Página Inicial
Agora, altere o arquivo index.php na pasta principal do seu projeto. E coloque esta
marcação:
<?php require_once 'config.php'; ?>
<?php require_once DBAPI; ?>
<?php include(HEADER_TEMPLATE); ?>
<?php $db = open_database(); ?>
<h1>Dashboard</h1>
<hr />
<?php if ($db) : ?>
<div class="row">
<div class="col-xs-6 col-sm-3 col-md-2">
<a href="customers/add.php" class="btn btn-primary">
<div class="row">
<div class="col-xs-12 text-center">
<i class="fa fa-plus fa-5x"></i>
</div>
<div class="col-xs-12 text-center">
<p>Novo Cliente</p>
</div>
</div>
</a>
</div>
15. <div class="col-xs-6 col-sm-3 col-md-2">
<a href="customers" class="btn btn-default">
<div class="row">
<div class="col-xs-12 text-center">
<i class="fa fa-user fa-5x"></i>
</div>
<div class="col-xs-12 text-center">
<p>Clientes</p>
</div>
</div>
</a>
</div>
</div>
<?php else : ?>
<div class="alert alert-danger" role="alert">
<p><strong>ERRO:</strong> Não foi possível Conectar ao Banco de Dados!</p>
</div>
<?php endif; ?>
<?php include(FOOTER_TEMPLATE); ?>
view rawindex.php hosted with by GitHub
As primeiras linhas fazem a inclusão do arquivo de configuração e da camada de
banco de dados.
Na linha 4, temos o seguinte comando:
<?php include(HEADER_TEMPLATE); ?>
16. É ele que faz a importação do nosso template de header para a página, e traz toda
aquela marcação em HTML. Assim, você não precisa escrever o topo da página em
cada script.
Depois disso, é que começa a página em si. Coloquei um título simples, e um grid que
vai manter os botões do dashboard. Esses botões usam o componente do Bootstrap e
o ícone vem do Font Awesome.
Por último, usei o comando para importar o template footer da página:
<?php include(FOOTER_TEMPLATE); ?>
Agora acesse pelo navegador, e verifique se a página está aparecendo corretamente.
http://localhost/crud-bootstrap
Até aqui, seu projeto deve estar assim:
crud-bootstrap-php
css
fonts
inc
database.php
footer.php
header.php
js
config.php
index.php
Agora, neste tutorial, você vai ver como criar os arquivos funções para usar em um
módulo de cadastro de clientes. Depois disso, vamos criar uma listagem inicial com os
botões de acesso para as funcionalidades do cadastro, como inserção, edição e
exclusão de cada registro.
17. Passo 1: Crie o Módulo e as Funções
Para começar, crie uma pasta chamada “customers“.
Essa pasta será o nosso módulo de clientes, e ela terá todas as funcionalidades
relacionadas a este model, ou entidade.
Dentro da pasta, crie um arquivo chamado “functions.php“. Esse arquivo terá todas as
funções das telas de cadastro de clientes. O código desse arquivo fica assim, por
enquanto:
<?php
require_once('../config.php');
require_once(DBAPI);
$customers = null;
$customer = null;
/**
* Listagem de Clientes
*/
function index() {
global $customers;
$customers = find_all('customers');
}
18. view rawfunctions.php hosted with by GitHub
As primeiras linhas fazem a importação do arquivo de configurações e da camada de
acesso a dados (DBAPI).
Depois, eu criei duas variáveis globais, para serem usadas entre as funções, e que vão
guardar os registros que estiverem sendo usados:
A variável $customers, irá guardar um conjunto de registros de clientes.
E a variável $customer guardará um único cliente, para os casos de inserção e
atualização (CREATE e UPDATE).
Observe a diferença entre plural e singular nos nomes de variáveis. Em web, você vai
usar muito isso: plural para vários, e singular para um único item.
A função index() é a função que será chamada na tela principal de clientes, e ela fará a
consulta pelos registros no banco de dados, e depois colocará tudo na
variável $customers, para que possamos exibir.
Observe que tem uma função find_all() sendo usada, é ela que traz os dados. Mas,
essa função não existe ainda.
Precisamos implementar essa função no arquivo database.php.
Passo 2: Implemente a Consulta no Banco de
Dados
Agora, vamos implementar as funções de consulta ao banco de dados. Vamos tentar
deixar o mais genérico possível.
Abra o arquivo database.php, que está na pasta /inc do seu projeto.
Crie a função a seguir:
<?php
/**
* Pesquisa um Registro pelo ID em uma Tabela
*/
function find( $table = null, $id = null ) {
$database = open_database();
$found = null;
try {
19. if ($id) {
$sql = "SELECT * FROM " . $table . " WHERE id = " . $id;
$result = $database->query($sql);
if ($result->num_rows > 0) {
$found = $result->fetch_assoc();
}
} else {
$sql = "SELECT * FROM " . $table;
$result = $database->query($sql);
if ($result->num_rows > 0) {
$found = $result->fetch_all(MYSQLI_ASSOC);
/* Metodo alternativo
$found = array();
while ($row = $result->fetch_assoc()) {
array_push($found, $row);
} */
}
}
} catch (Exception $e) {
$_SESSION['message'] = $e->GetMessage();
$_SESSION['type'] = 'danger';
}
close_database($database);
return $found;
}
view rawdatabase.php hosted with by GitHub
Essa função find faz uma busca em uma determinada tabela.
20. Se for passado algum id, nos parâmetros, a pesquisa será feita por esse id, que é a
chave primária da tabela (como definimos no começo).
Se não for passado o id, a consulta retornará todos os registros da tabela.
Nos dois casos, a consulta retornará dados associativos (usando
o fetch_assoc e MYSQLI_ASSOC), ou seja, são arrays com o nome da coluna e o
valor dela. Assim, fica mais fácil na hora de implementar a tela.
Caso aconteça algum problema na consulta e for disparada uma Exceção, nós
devemos exibir o que aconteceu em forma de mensagem. Para isso, eu criei duas
variáveis de sessão, do PHP, que vão guardar a mensagem da exception, e assim
poderemos exibir na tela.
Agora, crie também a seguinte função:
<?php
/**
* Pesquisa Todos os Registros de uma Tabela
*/
function find_all( $table ) {
return find($table);
}
view rawdatabase.php hosted with by GitHub
Essa função é só um alias (leia-se “aláias”) para a função find, ou seja, uma outra
forma mais prática de chamar a função sem precisar do parâmetro.
A função find_all retorna todos os registros de uma tabela.
Passo 3: Crie a Listagem dos Registros
Voltando na pasta “customers”, crie um arquivo chamado index.php.
Esse arquivo será a listagem dos registros, e também será a página principal do
módulo de clientes.
Implemente a marcação abaixo, nesse arquivo:
<?php
require_once('functions.php');
index();
?>
23. <?php include(FOOTER_TEMPLATE); ?>
view rawindex.php hosted with by GitHub
Vamos por partes…
As primeiras linhas fazem a ligação dessa página com o módulo de clientes (pelo
arquivo functions.php) e chama função index, que é o backend desta página.
Depois, coloquei um include para trazer o template de header da página, com todos os
CSS’s e Metatags necessários. Assim, não precisamos reescrever essa parte.
A partir da linha oito (8) começa a marcação da listagem, apenas com um topo simples
e algumas opções.
Na linha 20, você pode ver a verificação de mensagens de seção. Isso serve para
exibir alguma notificação que tenha sido definida no backend, como mensagens de
erro ou de sucesso, por exemplo.
Depois, você pode ver a tabela de registros. Dentro dela tem um loop (usando
o foreach) que vai pegar cada registro da variável $customers e criar uma linha nessa
tabela e exibir os dados. Como usamos os dados de forma associativa (lá na camada
de acesso a dados), é possível obter esses dados pelo nome das colunas.
Isso é um padrão em vários frameworks. Também é possível criar objetos dessa
forma.
A linha 49, mostra como você pode criar links para operações nos registros da tabela.
Basta passar o ID como parâmetro, e a função no backend (do arquivo functions.php)
deve ler e usar esse parâmetro.
E, no final, coloquei o template de footer, para fechar a página.
Passo 4: Adicione Registros via SQL
Para ver essa tela funcionando, enquanto não temos as telas de inserção, você pode
criar registros na tabela “customers” via SQL, usando o PHPMyAdmin, por exemplo:
INSERT INTO `customers` (`id`, `name`, `cpf_cnpj`, `birthdate`, `address`,
`hood`, `zip_code`, `city`, `state`, `phone`, `mobile`, `ie`, `created`, `modified`)
VALUES ('0', 'Fulano de Tal', '123.456.789-00', '1989-01-01', 'Rua da Web, 123',
'Internet', '1234568', 'Teste', 'Teste', '5555555', '55555555', '123456',
'2016-05-24 00:00:00', '2016-05-24 00:00:00');
Você pode alterar esse SQL para criar mais registros.
Até aqui, você deve ter uma tela, mais ou menos, como essa:
24. E a estrutura do seu projeto deve estar assim:
crud-bootstrap-php
css
customers
functions.php
index.php
fonts
inc
database.php
footer.php
header.php
js
config.php
index.php
vamos criar as funções de persistência dessas informações no banco de dados.
25. Este tutorial é um pouco extenso, e tem alguns códigos mais complexos. Separe um
tempo para entender bem, e caso não entenda alguma parte, é só perguntar nos
comentários.
Passo 1: Crie a Função de Cadastro
Voltando à pasta “customers“, adicione estas a função de cadastro no arquivo
functions.php:
<?php
/**
* Cadastro de Clientes
*/
function add() {
if (!empty($_POST['customer'])) {
$today =
date_create('now', new DateTimeZone('America/Sao_Paulo'));
$customer = $_POST['customer'];
$customer['modified'] = $customer['created'] = $today->format("Y-m-d H:i:s");
save('customers', $customer);
26. header('location: index.php');
}
}
view rawfunctions.php hosted with by GitHub
Passo 2: Crie o Formulário de Cadastro
Agora, crie um arquivo chamado add.php na pasta customers. Esse arquivo vai ter a
marcação do formulário de cadastro do cliente:
<?php
require_once('functions.php');
add();
?>
<?php include(HEADER_TEMPLATE); ?>
<h2>Novo Cliente</h2>
<form action="add.php" method="post">
<!-- area de campos do form -->
<hr />
<div class="row">
<div class="form-group col-md-7">
<label for="name">Nome / Razão Social</label>
<input type="text" class="form-control" name="customer['name']">
</div>
<div class="form-group col-md-3">
<label for="campo2">CNPJ / CPF</label>
29. <div class="col-md-12">
<button type="submit" class="btn btn-primary">Salvar</button>
<a href="index.php" class="btn btn-default">Cancelar</a>
</div>
</div>
</form>
<?php include(FOOTER_TEMPLATE); ?>
view rawadd.php hosted with by GitHub
Passo 3: Crie a Função de Persistência no
BD
No arquivo database.php, implemente a função que vai inserir um registro no banco de
dados:
<?php
/**
* Insere um registro no BD
*/
function save($table = null, $data = null) {
$database = open_database();
$columns = null;
$values = null;
//print_r($data);
foreach ($data as $key => $value) {
$columns .= trim($key, "'") . ",";
$values .= "'$value',";
}
// remove a ultima virgula
$columns = rtrim($columns, ',');
$values = rtrim($values, ',');
30. $sql = "INSERT INTO " . $table . "($columns)" . " VALUES " . "($values);";
try {
$database->query($sql);
$_SESSION['message'] = 'Registro cadastrado com sucesso.';
$_SESSION['type'] = 'success';
} catch (Exception $e) {
$_SESSION['message'] = 'Nao foi possivel realizar a operacao.';
$_SESSION['type'] = 'danger';
}
close_database($database);
}
view rawdatabase.php hosted with by GitHub
Passo 4: Crie a Função de
Edição/Atualização
Agora, vamos fazer a parte de edição, ou atualização dos clientes.
O primeiro passo é implementar a função edit() no módulo de clientes, ou seja, no
arquivo functions.php:
<?php
/**
* Atualizacao/Edicao de Cliente
*/
function edit() {
$now = date_create('now', new DateTimeZone('America/Sao_Paulo'));
if (isset($_GET['id'])) {
$id = $_GET['id'];
if (isset($_POST['customer'])) {
$customer = $_POST['customer'];
$customer['modified'] = $now->format("Y-m-d H:i:s");
31. update('customers', $id, $customer);
header('location: index.php');
} else {
global $customer;
$customer = find('customers', $id);
}
} else {
header('location: index.php');
}
}
view rawfunctions.php hosted with by GitHub
Passo 5: Implemente o Formulário de Edição
Agora, crie um arquivo chamado edit.php na past a customers. Esse arquivo vai ter a
marcação do formulário de edição do cliente, que é quase igual à do cadastro:
<?php
require_once('functions.php');
edit();
?>
<?php include(HEADER_TEMPLATE); ?>
<h2>Atualizar Cliente</h2>
<form action="edit.php?id=<?php echo $customer['id']; ?>" method="post">
<hr />
<div class="row">
<div class="form-group col-md-7">
34. <label for="campo3">Inscrição Estadual</label>
<input type="text" class="form-control" name="customer['ie']" value="<?php echo $customer['ie']; ?>">
</div>
<div class="form-group col-md-2">
<label for="campo3">UF</label>
<input type="text" class="form-control">
</div>
</div>
<div id="actions" class="row">
<div class="col-md-12">
<button type="submit" class="btn btn-primary">Salvar</button>
<a href="index.php" class="btn btn-default">Cancelar</a>
</div>
</div>
</form>
<?php include(FOOTER_TEMPLATE); ?>
view rawedit.php hosted with by GitHub
Passo 6: Crie a Função de Atualização no BD
E no arquivo database.php, implemente a função que faz a atualização de um registro
no banco de dados:
<?php
/**
* Atualiza um registro em uma tabela, por ID
*/
function update($table = null, $id = 0, $data = null) {
$database = open_database();
35. $items = null;
foreach ($data as $key => $value) {
$items .= trim($key, "'") . "='$value',";
}
// remove a ultima virgula
$items = rtrim($items, ',');
$sql = "UPDATE " . $table;
$sql .= " SET $items";
$sql .= " WHERE id=" . $id . ";";
try {
$database->query($sql);
$_SESSION['message'] = 'Registro atualizado com sucesso.';
$_SESSION['type'] = 'success';
} catch (Exception $e) {
$_SESSION['message'] = 'Nao foi possivel realizar a operacao.';
$_SESSION['type'] = 'danger';
}
close_database($database);
}
view rawdatabase.php hosted with by GitHub
você vai ver como criar os arquivos e funções para implementar a tela de visualização
do cadastro de um cliente.
36. Passo 1: Revise a Consulta de Registros no
BD
No tutorial de listagem do CRUD, você deve ter criado a função find(), no
arquivo database.php.
Essa função faz a consulta de um registro, pelo ID, em uma tabela do banco de dados.
Aqui, vamos reaproveitar essa função para implementar a tela de detalhes do cliente.
Passo 2: Crie a Função de Visualização
Dentro do arquivo funcions.php, na pasta customers, implemente a função que
carrega os dados do cliente:
<?php
/**
* Visualização de um Cliente
*/
function view($id = null) {
global $customer;
$customer = find('customers', $id);
}
37. view rawfunctions.php hosted with by GitHub
Essa função faz a busca na tabela clientes pelo ID que foi passado pela requisição
(através do parâmetro $id).
Depois, o resultado é guardado na variável $customer, que será acessada na tela de
visualização.
Passo 3: Crie a Tela de Visualização
Voltando na pasta “customers”, crie um arquivo chamado view.php.
Esse arquivo será a visualização em detalhes do registro, ou seja, a detail view do
nosso CRUD.
Implemente a marcação abaixo, nesse arquivo:
<?php
require_once('functions.php');
view($_GET['id']);
?>
<?php include(HEADER_TEMPLATE); ?>
<h2>Cliente <?php echo $customer['id']; ?></h2>
<hr>
<?php if (!empty($_SESSION['message'])) : ?>
<div class="alert alert-<?php echo $_SESSION['type']; ?>"><?php echo $_SESSION['message']; ?></div>
<?php endif; ?>
<dl class="dl-horizontal">
<dt>Nome / Razão Social:</dt>
<dd><?php echo $customer['name']; ?></dd>
39. <dt>Telefone:</dt>
<dd><?php echo $customer['phone']; ?></dd>
<dt>Celular:</dt>
<dd><?php echo $customer['mobile']; ?></dd>
<dt>UF:</dt>
<dd><?php echo $customer['state']; ?></dd>
<dt>Inscrição Estadual:</dt>
<dd><?php echo $customer['ie']; ?></dd>
</dl>
<div id="actions" class="row">
<div class="col-md-12">
<a href="edit.php?id=<?php echo $customer['id']; ?>" class="btn btn-primary">Editar</a>
<a href="index.php" class="btn btn-default">Voltar</a>
</div>
</div>
<?php include(FOOTER_TEMPLATE); ?>
view rawview.php hosted with by GitHub
Você pode adicionar mais itens, se achar necessário.
você vai ver como criar a parte de exclusão de registros, usando o componente de
modal do Bootstrap.
40. Passo 1: Crie a Função de Exclusão
Voltando à pasta customers, implemente a função de exclusão no módulo de clientes,
ou seja, no arquivo functions.php:
<?php
/**
* Exclusão de um Cliente
*/
function delete($id = null) {
global $customer;
$customer = remove('customers', $id);
header('location: index.php');
}
view rawfunctions.php hosted with by GitHub
Passo 2: Crie o Modal de Confirmação
Agora, precisamos criar o modal de confirmação que irá aparecer quando o usuário
apertar o botão de Excluir.
Para isso, crie um arquivo chamado modal.php, dentro da pasta customers, e adicione
essa marcação:
41. <!-- Modal de Delete-->
<div class="modal fade" id="delete-modal" tabindex="-1" role="dialog" aria-labelledby="modalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Fechar"><span aria-hidden="true
<h4 class="modal-title" id="modalLabel">Excluir Item</h4>
</div>
<div class="modal-body">
Deseja realmente excluir este item?
</div>
<div class="modal-footer">
<a id="confirm" class="btn btn-primary" href="#">Sim</a>
<a id="cancel" class="btn btn-default" data-dismiss="modal">Não</a>
</div>
</div>
</div>
</div> <!-- /.modal -->
view rawmodal.php hosted with by GitHub
Passo 3: Inclua o Modal na Listagem
(importante!)
Faça a importação do arquivo modal.php no arquivo index.php. Coloque antes
do template do footer:
// index.php
...
<?php include('modal.php'); ?>
42. <?php include(FOOTER_TEMPLATE); ?>
Com isso, a marcação do modal vai ser injetada na página de listagem e aí o modal
poderá ser exibido.
Passo 4: Implemente a chamada JavaScript
para excluir
Na pasta /js do seu projeto, deve ter um arquivo chamado main.js. Se não tiver, crie
ele.
Nesse arquivo, você deve implementar o evento que passa os dados para o modal e
chama a função de exclusão:
/**
* Passa os dados do cliente para o Modal, e atualiza o link para exclusão
*/
$('#delete-modal').on('show.bs.modal', function (event) {
var button = $(event.relatedTarget);
var id = button.data('customer');
var modal = $(this);
modal.find('.modal-title').text('Excluir Cliente #' + id);
modal.find('#confirm').attr('href', 'delete.php?id=' + id);
})
view rawmain.js hosted with by GitHub
Este arquivo já deve estar referenciado no seu projeto, pelo template do footer. Se não
estiver, você precisará adicionar essa referência, como foi feito na parte 2 desta série.
Passo 5: Crie a Página de Exclusão
Na pasta customers, crie um arquivo chamado delete.php.
Esse arquivo vai receber a chamada do JavaScript junto com o ID do cliente, e
executará a exclusão.
Implemente a marcação abaixo, nesse arquivo:
43. <?php
require_once('functions.php');
if (isset($_GET['id'])){
delete($_GET['id']);
} else {
die("ERRO: ID não definido.");
}
?>
view rawdelete.php hosted with by GitHub
Passo 6: Implemente o SQL de Exclusão
Para finalizar, falta o comando de exclusão no banco de dados.
No arquivo inc/database.php, implemente a função remove:
<?php
/**
* Remove uma linha de uma tabela pelo ID do registro
*/
function remove( $table = null, $id = null ) {
$database = open_database();
try {
if ($id) {
$sql = "DELETE FROM " . $table . " WHERE id = " . $id;
$result = $database->query($sql);
if ($result = $database->query($sql)) {
$_SESSION['message'] = "Registro Removido com Sucesso.";
$_SESSION['type'] = 'success';
}
}
} catch (Exception $e) {
$_SESSION['message'] = $e->GetMessage();