Buscar

CRUD com PHP Procedural e Bootstrap

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes
Você viu 3, do total de 22 páginas

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes
Você viu 6, do total de 22 páginas

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes
Você viu 9, do total de 22 páginas

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Prévia do material em texto

<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
Programação WEB 
professor Tiago 
 
Documentação PHP 
 
https://www.php.net/manual/pt_BR/ 
 
Sumário 
 
Criar banco de dados e tabela 
Criar a conexão com o banco de dados 
Criar arquivo de acesso ao banco de dados 
Criar index.php usando bootstrap 
Criar tela para listar paciente 
Criar tela de cadastro de paciente 
Inserir paciente no banco de dados 
Consultar lista de pacientes no banco de dados 
Excluir paciente no banco de dados 
Alterar paciente no banco de dados 
Nenhum resultado na lista de paciente 
Usando sessão para mostrar mensagem 
Validação e Filtros 
Validação no backend usando PHP 
Validação no frontend HTML5 
Validação no frontend Bootstrap 
Validação no frontend - outras formas 
Máscaras em campos de input do formulário 
 
 
 
 
 
 
 
 
https://www.php.net/manual/pt_BR/
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
Criar banco de dados e tabela 
 
1 - Criar banco de dados com o nome ‘crud’ no MySQL 
2 - Criar tabela ‘paciente’ com os campos abaixo: 
 
Paciente 
id (chave primária) 
cpf 
nome 
telefone 
email 
 
CREATE ​ ​TABLE ​ ​`crud` ​. ​`paciente` ​ ( 
`id` ​ ​INT ​ ​NOT ​ ​NULL ​ ​AUTO_INCREMENT ​ , 
`cpf` ​VARCHAR ​( ​11 ​) ​NOT ​ ​NULL ​ , 
`nome` ​ ​VARCHAR ​( ​100 ​) ​NOT ​ ​NULL ​ , 
`telefone` ​ ​VARCHAR ​( ​11 ​) ​NOT ​NULL ​ , 
`email` ​ ​VARCHAR ​( ​100 ​) ​NOT ​ ​NULL ​ , 
PRIMARY ​ ​KEY ​ ( ​`id` ​)) ​ENGINE ​ = ​InnoDB ​; 
 
Criar a conexão com o banco de dados 
Documentação funções mysql no php = ​https://www.php.net/manual/pt_BR/book.mysql.php 
 
1 - criar o arquivo ‘conexao.php’ 
segue exemplo do código de conexão utilizando programação procedural 
 
<?php 
//conexao com banco de dados 
$servidor ​ = ​"localhost" ​; 
$usuario ​ = ​"root" ​; 
$senha ​ = ​"" ​; 
$banco ​ = ​"crud" ​; 
 
$conexao ​ = ​mysqli_connect ​( ​$servidor ​, ​$usuario ​, ​$senha ​, ​$banco ​); 
 
//caso ocorra erro na conexao exibe mensagem de erro 
if ​ (! ​$conexao ​) { 
 ​echo ​ ​"ERRO = " ​ . ​mysqli_connect_error ​(); 
} 
 
 
http://localhost/phpmyadmin/url.php?url=https://dev.mysql.com/doc/refman/5.5/en/create-table.html
http://localhost/phpmyadmin/url.php?url=https://dev.mysql.com/doc/refman/5.5/en/create-table.html
http://localhost/phpmyadmin/url.php?url=https://dev.mysql.com/doc/refman/5.5/en/numeric-types.html
http://localhost/phpmyadmin/url.php?url=https://dev.mysql.com/doc/refman/5.5/en/logical-operators.html#operator_not
http://localhost/phpmyadmin/url.php?url=https://dev.mysql.com/doc/refman/5.5/en/string-types.html
http://localhost/phpmyadmin/url.php?url=https://dev.mysql.com/doc/refman/5.5/en/logical-operators.html#operator_not
http://localhost/phpmyadmin/url.php?url=https://dev.mysql.com/doc/refman/5.5/en/string-types.html
http://localhost/phpmyadmin/url.php?url=https://dev.mysql.com/doc/refman/5.5/en/logical-operators.html#operator_not
http://localhost/phpmyadmin/url.php?url=https://dev.mysql.com/doc/refman/5.5/en/string-types.html
http://localhost/phpmyadmin/url.php?url=https://dev.mysql.com/doc/refman/5.5/en/logical-operators.html#operator_not
http://localhost/phpmyadmin/url.php?url=https://dev.mysql.com/doc/refman/5.5/en/string-types.html
http://localhost/phpmyadmin/url.php?url=https://dev.mysql.com/doc/refman/5.5/en/logical-operators.html#operator_not
https://www.php.net/manual/pt_BR/book.mysql.php
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
Criar arquivo de acesso ao banco de dados 
 
1 - criar um arquivo chamado ‘banco-paciente.php’, esse arquivo será responsável por ter 
todas as funções (select, insert, update e delete) de acesso do banco de dados. 
 
Dessa forma, o código fica organizado. Pois, todo comando SQL está dentro desse arquivo. 
 
Segue exemplo abaixo: 
<?php 
require_once ​( ​"conexao.php" ​); 
 
//função para retornar todos os pacientes 
function ​ ​listarPaciente ​( ​$conexao ​){ 
 ​//monta SQL 
 ​$query ​ = ​" ​SELECT ​ id, cpf, nome, telefone, email ​FROM ​ paciente" ​; 
 ​//executa SQL 
 ​$resultado ​ = ​mysqli_query ​( ​$conexao ​, ​$query ​); 
 
 ​//cria uma array de pacientes 
 ​$pacientes ​ = ​array ​(); 
 
 ​//le resultado do SQL e coloca dentro da array 
 ​while ​ ( ​$dados ​ = ​mysqli_fetch_array ​( ​$resultado ​)) { 
 ​array_push ​( ​$pacientes ​, ​$dados ​); 
 } 
 
 ​//retorna array com os dados 
 ​return ​ ​$pacientes ​; 
} 
 
 
 
 
//função para buscar um paciente por ID 
function ​ ​buscarPaciente ​( ​$conexao ​, ​ $id ​) { 
 ​//monta SQL para pegar um paciente especifico 
 ​$query ​ = ​" ​SELECT ​ id, cpf, nome, telefone, email ​FROM ​ paciente ​WHERE ​ id ​= ​ ​$id ​" ​; 
 ​//executa SQL 
 ​$resultado ​ = ​mysqli_query ​( ​$conexao ​, ​$query ​); 
 ​return ​ ​mysqli_fetch_assoc ​( ​$resultado ​); 
} 
 
//função para inserir um paciente 
function ​ ​inserirPaciente ​( ​$conexao ​, ​ $cpf ​, ​ $nome ​, ​ $telefone ​, ​ $email ​){ 
 
 ​$cpf ​ = ​mysqli_escape_string ​( ​$conexao ​, ​$cpf ​); 
 ​$nome ​ = ​mysqli_escape_string ​( ​$conexao ​, ​$nome ​); 
 ​$telefone ​ = ​mysqli_escape_string ​( ​$conexao ​, ​$telefone ​); 
 ​$email ​ = ​mysqli_escape_string ​( ​$conexao ​, ​$email ​); 
 
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
 
 ​//monta o SQL 
 ​$query ​ = ​"insert into paciente (cpf, nome, telefone, email) values (' ​$cpf ​', ' ​$nome ​', 
' ​$telefone ​',' ​$email ​')" ​; 
 ​//executa o SQL 
 ​$resultadoInsercao ​ = ​mysqli_query ​( ​$conexao ​, ​$query ​); 
 ​//retorna resultado da execucao 
 ​return ​ ​$resultadoInsercao ​; 
} 
 
//função para alterar um paciente 
function ​ ​alterarPaciente ​( ​$conexao ​, ​ $id ​, ​ $cpf ​, ​ $nome ​, ​ $telefone ​, ​ $email ​) { 
 ​$id ​ = ​mysqli_escape_string ​( ​$conexao ​, ​$id ​); 
 ​$cpf ​ = ​mysqli_escape_string ​( ​$conexao ​, ​$cpf ​); 
 ​$nome ​ = ​mysqli_escape_string ​( ​$conexao ​, ​$nome ​); 
 ​$telefone ​ = ​mysqli_escape_string ​( ​$conexao ​, ​$telefone ​); 
 ​$email ​ = ​mysqli_escape_string ​( ​$conexao ​, ​$email ​); 
 
 ​//monta SQL 
 ​$query ​ = ​" ​UPDATE ​ paciente ​SET ​ cpf ​= ​ ' ​$cpf ​', nome ​= ​ ' ​$nome ​', telefone ​= ​ ' ​$telefone ​', 
email ​= ​ ' ​$email ​' ​WHERE ​ id ​= ​ ​$id ​" ​; 
 ​//executa o SQL 
 ​$resultadoAlteracao ​ = ​mysqli_query ​( ​$conexao ​, ​$query ​); 
 ​//retorna resultado da execucao 
 ​return ​ ​$resultadoAlteracao ​; 
} 
 
//função para excluir um paciente 
function ​ ​removerPaciente ​( ​$conexao ​, ​ $id ​) { 
 ​$id ​ = ​mysqli_escape_string ​( ​$conexao ​, ​$id ​); 
 ​//monta SQL 
 ​$query ​ = ​" ​DELETE ​ ​FROM ​ paciente ​where ​ id ​= ​ ​$id ​" ​; 
 ​//executa SQL 
 ​$resultadoExclusao ​ = ​mysqli_query ​( ​$conexao ​, ​$query ​); 
 ​return ​ ​$resultadoExclusao ​; 
} 
 
?> 
 
 
 
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
Criar index.php usando bootstrap 
 
1- criar arquivo ‘index.php’ incluindo bootstrap conforme código abaixo: 
 
Documentação bootstrap: ​https://getbootstrap.com/docs/4.3/getting-started/introduction/ 
 
Exemplo ‘index.php’ 
 
<! ​DOCTYPE ​ ​html ​> 
< ​html ​ ​lang ​= ​"pt-BR" ​> 
< ​head ​> 
 ​< ​meta ​ ​charset ​= ​"UTF-8" ​> 
 ​< ​meta ​ ​name ​= ​"viewport" ​ ​content ​= ​"width=device-width, initial-scale=1.0" ​> 
 ​< ​meta ​ ​http-equiv ​= ​"X-UA-Compatible" ​ ​content ​= ​"ie=edge" ​> 
 ​< ​title ​> ​CRUD PHP procedural ​</ ​title ​> 
 
 ​<!-- CSS do Bootstrap --> 
 ​< ​link ​ ​rel ​= ​"stylesheet" 
href ​= ​"https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" 
integrity ​= ​"sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" 
crossorigin ​= ​"anonymous" ​> 
</ ​head ​> 
< ​body ​> 
 
 ​< ​header ​> 
 ​<!-- AQUI VAI O CABEÇALHO --> 
 ​</ ​header ​> 
 
 ​< ​section ​> 
 ​<!-- AQUI VAI O CONTEÚDO PRINCIPAL --> 
 ​</ ​section ​> 
 
 ​< ​footer​> 
 ​<!-- AQUI VAI O RODAPÉ --> 
 ​</ ​footer ​> 
 
 ​<!-- JavaScript --> 
 ​< ​script ​ ​src ​= ​"https://code.jquery.com/jquery-3.3.1.slim.min.js" 
integrity ​= ​"sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" 
crossorigin ​= ​"anonymous" ​></ ​script ​> 
 ​< ​script 
src ​= ​"https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" 
integrity ​= ​"sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" 
crossorigin ​= ​"anonymous" ​></ ​script ​> 
 ​< ​script ​ ​src ​= ​"https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" 
integrity ​= ​"sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" 
crossorigin ​= ​"anonymous" ​></ ​script ​> 
</ ​body ​> 
</ ​html ​> 
 
https://getbootstrap.com/docs/4.3/getting-started/introduction/
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
 
 
2 - incluir no <header> o menu usando bootstrap 
 
documentação bootstrap: ​https://getbootstrap.com/docs/4.3/components/navbar/ 
 
menu deve ficar dessa forma: 
 
 
 
Separar cabeçalho e rodapé em arquivos diferentes 
1 - Recortar o código abaixo da página ‘index.php’ e colar em um novo arquivo chamado 
“cabecalho.php” e salvar arquivo. 
 
<! ​DOCTYPE ​ ​html ​> 
< ​html ​ ​lang ​= ​"pt-BR" ​> 
< ​head ​> 
 ​< ​meta ​ ​charset ​= ​"UTF-8" ​> 
 ​< ​meta ​ ​name ​= ​"viewport" ​ ​content ​= ​"width=device-width, initial-scale=1.0" ​> 
 ​< ​meta ​ ​http-equiv ​= ​"X-UA-Compatible" ​ ​content ​= ​"ie=edge" ​> 
 ​< ​title ​> ​CRUD PHP procedural ​</ ​title ​> 
 
 ​<!-- CSS do Bootstrap --> 
 ​< ​link ​ ​rel ​= ​"stylesheet" 
href ​= ​"https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" 
integrity ​= ​"sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" 
crossorigin ​= ​"anonymous" ​> 
</ ​head ​> 
< ​body ​> 
 
 ​< ​header ​> 
 
 ​< ​nav ​ ​class ​= ​"navbar navbar-expand-lg navbar-light bg-light" ​> 
 ​< ​a ​ ​class ​= ​"navbar-brand" ​ ​href ​= ​"#" ​> ​CRUD PHP ​</ ​a ​> 
 ​< ​button ​ ​class ​= ​"navbar-toggler" ​ ​type ​= ​"button" ​ ​data-toggle ​= ​"collapse" 
data-target ​= ​"#navbarSupportedContent" ​ ​aria-controls ​= ​"navbarSupportedContent" 
aria-expanded ​= ​"false" ​ ​aria-label ​= ​"Toggle navigation" ​> 
 ​< ​span ​ ​class ​= ​"navbar-toggler-icon" ​></ ​span ​> 
 ​</ ​button ​> 
 
 ​< ​div ​ ​class ​= ​"collapse navbar-collapse" ​ ​id ​= ​"navbarSupportedContent" ​> 
 ​< ​ul ​ ​class ​= ​"navbar-nav mr-auto" ​> 
 
https://getbootstrap.com/docs/4.3/components/navbar/
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
 ​< ​li ​ ​class ​= ​"nav-item active" ​> 
 ​< ​a ​ ​class ​= ​"nav-link" ​ ​href ​= ​"#" ​> ​Paciente ​</ ​a ​> 
 ​</ ​li ​> 
 ​</ ​div ​> 
 ​</ ​nav ​> 
 
 ​</ ​header ​> 
 
 
2 - Recortar o código abaixo da página ‘index.php’ e colar em um novo arquivo chamado 
“rodape.php” e salvar arquivo. 
 
 ​< ​footer ​> 
 ​<!-- AQUI VAI O RODAPÉ --> 
 ​</ ​footer ​> 
 
 ​<!-- JavaScript --> 
 ​< ​script ​ ​src ​= ​"https://code.jquery.com/jquery-3.3.1.slim.min.js" 
integrity ​= ​"sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" 
crossorigin ​= ​"anonymous" ​></ ​script ​> 
 ​< ​script ​ ​src ​= ​"https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" 
integrity ​= ​"sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" 
crossorigin ​= ​"anonymous" ​></ ​script ​> 
 ​< ​script ​ ​src ​= ​"https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" 
integrity ​= ​"sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" 
crossorigin ​= ​"anonymous" ​></ ​script ​> 
</ ​body ​> 
</ ​html ​> 
 
 
3 - Agora no arquivo “index.php”, vamos utilizar o comando ‘require_once’ do php para 
importar os arquivos ‘cabecalho.php’ e ‘rodape.php’ na página ‘index.php’. 
 
o arquivo ‘index.php’ deve ficar assim: 
<!-- importa o arquivo cabeçalho --> 
<?php ​ ​require_once ​( ​"cabecalho.php" ​); ​?> 
 
 ​< ​section ​> 
 ​<!-- AQUI VAI O CONTEUDO PRINCIPAL --> 
 ​</ ​section ​> 
 
<!-- importa o arquivo rodapé --> 
<?php ​ ​require_once ​( ​"rodape.php" ​); ​?> 
 
Assim, você consegue reaproveitar o código do cabeçalho e rodapé em todas 
as páginas que criar aumentando a produtividade. 
 
Existem outros comandos para fazer importação como ​‘include’​ e ​‘require’​. 
Pesquise a diferença desses comandos no PHP. 
O que descobriu? 
 
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
 
Criar tela para listar paciente 
 
1 - criar arquivo “paciente-lista.php’, não esquecer de importar o cabeçalho e rodapé nesse 
arquivo. 
 
2 - criar a tabela usando bootstrap 
 
documentação bootstrap: ​https://getbootstrap.com/docs/4.3/content/tables/ 
 
3 - o arquivo ‘paciente-lista.php’ deve ficar assim. 
não esqueça de ajustar o link do menu para ‘chamar’ para o arquivo ‘paciente-lista.php’ 
 
 
Criar tela de cadastro de paciente 
 
1 - criar arquivo “paciente-form.php’, não esquecer de importar o cabeçalho e rodapé nesse 
arquivo. 
 
2 - criar o formulário usando bootstrap 
 
documentação bootstrap: ​https://getbootstrap.com/docs/4.3/components/forms/ 
 
3 - o arquivo ‘paciente-form.php’ deve ficar assim. 
não esqueça de ajustar o link do botão ‘novo paciente’ da tela ‘paciente-lista.php’ para 
chamar ‘paciente-form.php’ 
 
https://getbootstrap.com/docs/4.3/content/tables/
https://getbootstrap.com/docs/4.3/components/forms/
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
 
 
Inserir paciente no banco de dados 
1 - agora vamos criar o código PHP para fazer o insert no banco de dados, para isso crie 
um arquivo chamado ‘paciente-action-inserir.php’. 
 
Exemplo do código: 
<?php 
require_once ​( ​"cabecalho.php" ​); 
require_once ​( ​"banco-paciente.php" ​); 
 
 ​//pega as informações do POST do formulário 
 ​$cpf ​ = ​$_POST ​[ ​'cpf' ​]; 
 ​$nome ​ = ​$_POST ​[ ​'nome' ​]; 
 ​$telefone ​ = ​$_POST ​[ ​'telefone' ​]; 
 ​$email ​ = ​$_POST ​[ ​'email' ​]; 
 
 ​//chamar função de inserir e verificar sucesso da execução 
 ​if ​( ​inserirPaciente ​( ​$conexao ​, ​$cpf ​, ​$nome ​, ​$telefone ​, ​$email ​)): 
 ​echo ​ ​'<div class="container alert alert-success">Paciente cadastrado com 
sucesso</div>' ​; 
 ​else ​: 
 ​echo ​ ​'<div class="container alert alert-danger">Erro no cadastrado de 
paciente</div>' ​; 
 ​endif ​; 
 
2 - Ajuste as informações do form para chamar ‘paciente-action-inserir.php’ 
 
< ​form ​ ​action ​= ​"paciente-action-inserir.php" ​ ​method ​= ​"post" ​> 
 
3 - efetue o teste, neste momento não estamos fazendo nenhuma validação dos campos 
antes de inserir no banco de dados. Segue o resultado, consulta mysql para verificar. 
 
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
 
Consultar lista de pacientes no banco de 
dados 
1 - agora vamos criar o código PHP para fazer a consulta e listar na tabela do arquivo 
‘paciente-lista.php’. 
 
2 - incluir no inicio do arquivo ‘paciente-lista.php’ o código abaixo. 
<?php ​ ​require_once ​( ​"banco-paciente.php" ​); 
 
//chama função que lista os pacientes do banco de dados e retorna uma array 
$pacientes ​ = ​listarPaciente ​( ​$conexao ​); 
 
?> 
 
3 - Agora que temos uma array chamada $pacientes, vamos ler esse array e montar a 
tabela. 
 
Segue código: 
 ​< ​table ​ ​class ​= ​"table" ​> 
 ​< ​thead ​> 
 ​< ​tr ​> 
 ​< ​th ​ ​scope ​= ​"col" ​> ​ID ​</ ​th ​> 
 ​< ​th ​ ​scope ​= ​"col" ​> ​CPF ​</ ​th ​> 
 ​< ​th ​ ​scope ​= ​"col" ​> ​Nome ​</ ​th ​> 
 ​< ​th ​ ​scope ​= ​"col" ​> ​Telefone ​</ ​th ​> 
 ​< ​th​ ​scope ​= ​"col" ​> ​Email ​</ ​th ​> 
 ​< ​th ​ ​scope ​= ​"col" ​></ ​th ​> 
 ​</ ​tr ​> 
 ​</ ​thead ​> 
 ​< ​tbody ​> 
 
 ​<?php 
 ​//ler todos os registros do array pacientes e colocar na tabela 
 ​foreach ​ ( ​$pacientes ​ as ​$paciente ​) : 
 ​?> 
 
 ​< ​tr ​> 
 ​< ​td ​> ​<?= ​ ​$paciente ​[ ​'id' ​] ​?> ​</ ​td ​> 
 ​< ​td ​> ​<?= ​ ​$paciente ​[ ​'cpf' ​] ​?> ​</ ​td ​> 
 ​< ​td ​> ​<?= ​ ​$paciente ​[ ​'nome' ​] ​?> ​</ ​td ​> 
 ​< ​td ​> ​<?= ​ ​$paciente ​[ ​'telefone' ​] ​?> ​</ ​td ​> 
 ​< ​td ​> ​<?= ​ ​$paciente ​[ ​'email' ​] ​?> ​</ ​td ​> 
 ​< ​td ​> 
 
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
 ​< ​a ​ ​href ​= ​"#" ​ ​class ​= ​"btn btn-info" ​> ​Alterar ​</ ​a ​> 
 ​< ​a ​ ​href ​= ​"#" ​ ​class ​= ​"btn btn-danger" ​ ​> ​Excluir ​</ ​a ​> 
 ​</ ​td ​> 
 
 ​</ ​tr ​> 
 ​<?php ​ ​endforeach ​ ​?> 
 
 ​</ ​tbody ​> 
 ​</ ​table ​> 
 
 
Excluir paciente no banco de dados 
1- Para chamar o programa de exclusão, temos que ajustar o link do botão excluir no 
arquivo ‘paciente-lista-php’, ficando dessa forma: 
 
< ​a ​ ​href ​= ​"paciente-action-excluir.php?id= ​<?= ​ ​$paciente ​[ ​'id' ​] ​?> ​" ​ ​class ​= ​"btn btn-danger" 
onclick ​= ​" ​return ​ ​confirm ​('Confirma exclusão de ​<?= ​ ​$paciente ​[ ​'nome' ​] ​?> ​?');" ​> ​Excluir ​</ ​a ​> 
 
 
2 - agora vamos criar o código PHP para fazer a exclusão do paciente. Para isso, criar o 
arquivo ‘paciente-action-excluir.php’ 
 
Exemplo do código: 
<?php 
require_once ​( ​"cabecalho.php" ​); 
require_once ​( ​"banco-paciente.php" ​); 
 
 ​//pega as informações formulário 
 ​$id ​ = ​$_GET ​[ ​'id' ​]; 
 
 ​//chamar função de inserir e verificar sucesso da execução 
 ​if ​( ​removerPaciente ​( ​$conexao ​, ​$id ​)): 
 ​echo ​ ​'<div class="container alert alert-success">Paciente excluido com 
sucesso</div>' ​; 
 ​else ​: 
 ​echo ​ ​'<div class="container alert alert-danger">Erro na exclusão de paciente</div>' ​; 
 ​endif ​; 
 
 
3 - Efetuar o teste e chamar a tela ‘paciente-lista.php’ para verificar o resultado 
 
 
 
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
Alterar paciente no banco de dados 
1- Para chamar a tela de alteração, temos que ajustar o link do botão alterar no arquivo 
‘paciente-lista-php’, ficando dessa forma: 
 
< ​a ​ ​href ​= ​"paciente-form-alterar.php?id= ​<?= ​ ​$paciente ​[ ​'id' ​] ​?> ​" ​ ​class ​= ​"btn 
btn-info" ​> ​Alterar ​</ ​a ​> 
 
 
2 - agora vamos criar a tela para alteração, ela será igual a página de inclusão adicionando 
somente o campo com o ID do paciente (escondido) e a consulta específica do paciente 
para pegar os dados para preencher o formulário. 
 
Criar o arquivo ‘paciente-form-alterar.php’, conforme código abaixo: 
 
<!-- importa o arquivo cabeçalho --> 
<?php ​ ​require_once ​( ​"cabecalho.php" ​); ​?> 
<?php ​ ​require_once ​( ​"banco-paciente.php" ​); 
//pega o id no GET 
$id ​ = ​$_GET ​[ ​'id' ​]; 
//chama função que busca o paciente para valorizar os campos do formulário 
$paciente ​ = ​buscarPaciente ​( ​$conexao ​, ​$id ​); 
?> 
 
 ​< ​section ​ ​class ​= ​"container mt-3" ​> 
 ​< ​div ​> 
 ​< ​h3 ​> ​Alterar Paciente ​</ ​h3 ​> 
 ​</ ​div ​> 
 
 ​< ​div ​> 
 
 ​< ​form ​ ​action ​= ​"paciente-action-editar.php" ​ ​method ​= ​"post" ​> 
 ​< ​input ​ ​type ​= ​"hidden" ​ ​id ​= ​"txtId" ​ ​name ​= ​"id" ​ ​value ​= ​" ​<?= ​$paciente ​[ ​'id' ​] ​?> ​" ​> 
 
 ​< ​div ​ ​class ​= ​"form-group" ​> 
 ​< ​label ​ ​for ​= ​"txtCPF" ​> ​CPF ​</ ​label ​> 
 ​< ​input ​ ​type ​= ​"number" ​ ​class ​= ​"form-control" ​ ​id ​= ​"txtCPF" ​ ​name ​= ​"cpf" 
placeholder ​= ​"digite seu CPF" ​ ​value ​= ​" ​<?= ​$paciente ​[ ​'cpf' ​] ​?> ​" ​> 
 ​</ ​div ​> 
 ​< ​div ​ ​class ​= ​"form-group" ​> 
 ​< ​label ​ ​for ​= ​"txtNome" ​> ​Nome ​</ ​label ​> 
 ​< ​input ​ ​type ​= ​"text" ​ ​class ​= ​"form-control" ​ ​id ​= ​"txtNome" ​ ​name ​= ​"nome" 
placeholder ​= ​"digite seu nome" ​ ​value ​= ​" ​<?= ​$paciente ​[ ​'nome' ​] ​?> ​" ​> 
 ​</ ​div ​> 
 ​< ​div ​ ​class ​= ​"form-group" ​> 
 ​< ​label ​ ​for ​= ​"txtTelefone" ​> ​Telefone ​</ ​label ​> 
 ​< ​input ​ ​type ​= ​"number" ​ ​class ​= ​"form-control" ​ ​id ​= ​"txtTelefone" ​ ​name ​= ​"telefone" 
placeholder ​= ​"digite seu telefone" ​ ​value ​= ​" ​<?= ​$paciente ​[ ​'telefone' ​] ​?> ​" ​> 
 ​</ ​div ​> 
 ​< ​div ​ ​class ​= ​"form-group" ​> 
 
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
 ​< ​label ​ ​for ​= ​"txtEmail" ​> ​Email ​</ ​label ​> 
 ​< ​input ​ ​type ​= ​"email" ​ ​class ​= ​"form-control" ​ ​id ​= ​"txtEmail" ​ ​name ​= ​"email" 
placeholder ​= ​"digite seu email" ​ ​value ​= ​" ​<?= ​$paciente ​[ ​'email' ​] ​?> ​" ​> 
 ​</ ​div ​> 
 
 ​< ​a ​ ​href ​= ​"paciente-lista.php" ​ ​class ​= ​"btn btn-secondary" ​> ​Cancelar ​</ ​a ​> 
 ​< ​button ​ ​type ​= ​"submit" ​ ​class ​= ​"btn btn-success" ​ ​name ​= ​"btnAlterar" ​> ​Alterar ​</ ​button ​> 
 ​</ ​form ​> 
 
 ​</ ​div ​> 
 ​</ ​section ​> 
 
<!-- importa o arquivo rodapé --> 
<?php ​ ​require_once ​( ​"rodape.php" ​); ​?> 
 
 
2 - agora vamos criar o código PHP para fazer a alteração do paciente. Para isso, criar o 
arquivo ‘paciente-action-editar.php’ que será chamado pelo formulário acima. 
 
Exemplo do código: 
<?php 
require_once ​( ​"cabecalho.php" ​); 
require_once ​( ​"banco-paciente.php" ​); 
 
 
 
//pega as informações do POST do formulário 
$id ​ = ​$_POST ​[ ​'id' ​]; 
$cpf ​ = ​$_POST ​[ ​'cpf' ​]; 
$nome ​ = ​$_POST ​[ ​'nome' ​]; 
$telefone ​ = ​$_POST ​[ ​'telefone' ​]; 
$email ​ = ​$_POST ​[ ​'email' ​]; 
 
 ​//chamar função de inserir e verificar sucesso da execução 
 ​if ​( ​alterarPaciente ​( ​$conexao ​, ​$id ​, ​$cpf ​, ​$nome ​, ​$telefone ​, ​$email ​)): 
 ​echo ​ ​'<div class="container alert alert-success">Paciente alterado com 
sucesso</div>' ​; 
 ​else ​: 
 ​echo ​ ​'<div class="container alert alert-danger">Erro na alteração de 
paciente</div>' ​; 
 ​endif ​; 
 
 
3 - Efetuar o teste e chamar a tela ‘paciente-lista.php’ para verificar o resultado 
 
 
 
 
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
Nenhum resultado na lista de paciente 
1- Quando a lista de paciente estiver vazia, mostrar a mensagem “Nenhum paciente 
cadastrado.” 
 
2 - Para mostrar a mensagem, verifique o tamanho do array e pergunte em um IF para 
mostrar a mensagem ou mostrar a tabela 
 
<?php ​if ​( ​sizeof ​( ​$pacientes ​) > ​0 ​): ​?> 
 ​< ​table ​ ​class ​= ​"table" ​> 
 ... 
 ​</ ​table ​> 
<?php ​ ​else ​: ​?> 
 ​< ​p ​> ​Nenhum paciente cadastrado. ​</ ​p ​> 
<?php ​ ​endif ​ ​?> 
 
Usando sessão para mostrar mensagem 
1- Você sabe o que é sessão? 
 
Segue um artigo sobre o assunto: 
https://klauslaube.com.br/2012/04/05/entendendo-os-cookies-e-sessoes.html 
 
2 - agora vamos usar a sessão para armazenar a mensagem da execução de alguma 
operação para exibir a mensagem em outra página. 
 
Atenção: sempre precisar usar esse comando ​session_start(); ​para usar sessão no php. 
 
Exemplo do uso da sessão no arquivo ‘paciente-action-inserir.php’ 
<?php 
require_once ​( ​"cabecalho.php" ​); 
require_once ​( ​"banco-paciente.php" ​); 
 
//inicia a sessão que será utilizada no caso de sucesso ou erro 
session_start ​(); 
 
 ​//pega as informações do POST do formulário 
 ​$cpf ​ = ​$_POST ​[ ​'cpf' ​]; 
 ​$nome​ = ​$_POST ​[ ​'nome' ​]; 
 ​$telefone ​ = ​$_POST ​[ ​'telefone' ​]; 
 ​$email ​ = ​$_POST ​[ ​'email' ​]; 
 
 ​if ​( ​inserirPaciente ​( ​$conexao ​, ​$cpf ​, ​$nome ​, ​$telefone ​, ​$email ​)): 
 ​$_SESSION ​[ ​"mensagem" ​] = ​"Paciente cadastrado com sucesso." ​; 
 ​header ​( ​"Location: paciente-lista.php" ​); 
 
https://klauslaube.com.br/2012/04/05/entendendo-os-cookies-e-sessoes.html
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
 ​else ​: 
 ​$_SESSION ​[ ​"mensagem" ​] = ​"Erro ao cadatrar paciente." ​; 
 ​header ​( ​"Location: paciente-lista.php" ​); 
 ​endif ​; 
 
Nesse código, iniciamos a sessão ‘session_start();’ criamos a variável na sessão com o 
nome de ‘mensagem’ e atribuímos uma mensagem para ela. 
O comando header location é somente para direcionar para a página ‘paciente-lista.php’ 
 
3 - agora no arquivo ‘paciente-lista.php’, vamos acessar a sessão e pegar a mensagem 
para exibir na tela 
 
Incluir o código abaixo: 
<?php 
//inicia sessão 
session_start ​(); 
//verifica se a sessão 'mensagem' existe 
if ​( ​isset ​( ​$_SESSION ​[ ​'mensagem' ​])) : 
 ​//exibe conteudo da 'mensagem' 
 ​echo ​ ​$_SESSION ​[ ​'mensagem' ​]); 
 ​//apaga a 'mensagem' da sessão 
 ​unset ​( ​$_SESSION ​[ ​'mensagem' ​]); 
endif ​; 
?> 
 
 
Personalizando a mensagem usando bootstrap 
1 - vamos criar mensagem diferente na sessão uma para sucesso e outra para erro. Para 
isso vamos usar as palavras da classe do bootstrap que vai nos ajudar. 
 
Exemplo código: 
 ​if ​( ​inserirPaciente ​( ​$conexao ​, ​$cpf ​, ​$nome ​, ​$telefone ​, ​$email ​)): 
 ​$_SESSION ​[ ​"success" ​] = ​"Paciente cadastrado com sucesso." ​; 
 ​header ​( ​"Location: paciente-lista.php" ​); 
 ​else ​: 
 ​$_SESSION ​[ ​"danger" ​] = ​"Erro ao cadatrar paciente." ​; 
 ​header ​( ​"Location: paciente-lista.php" ​); 
 ​endif ​; 
 
2- agora vamos criar um arquivo novo, que terá uma função para tratar as mensagens da 
sessão 
 
Arquivo ‘mostrar-alerta.php’, segue código 
<?php 
session_start ​(); 
 
function ​ ​mostraAlerta ​( ​$tipo ​) { 
 ​if ​( ​isset ​( ​$_SESSION ​[ ​$tipo ​])) : 
?> 
 
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
 
 ​< ​p ​ ​class ​= ​"p-3 alert- ​<?= ​ ​$tipo ​ ​?> ​" ​> ​<?= ​ ​$_SESSION ​[ ​$tipo ​] ​?> ​</ ​p ​> 
 
<?php 
 ​unset ​( ​$_SESSION ​[ ​$tipo ​]); 
 ​endif ​; 
} 
 
3- agora no arquivo ‘paciente-lista.php’, vamos usar a função do arquivo ‘mostrar-alerta’ 
para exibir a mensagem com o css personalizado 
 ​<?php 
 ​mostraAlerta ​( ​"success" ​); 
 ​mostraAlerta ​( ​"danger" ​) 
 ​?> 
 
 
 
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
Validação e Filtros 
 
Pensando na segurança e qualidade do nosso software, temos que ter muito 
cuidado com os dados antes de processar ou armazenar no banco de dados. 
Assim, devemos fazer validações para garantir que estamos recebendo as 
informações corretamente. 
Podemos fazer validações no backend (usando php no lado do servidor) e frontend 
(usando html5 e java script no lado do cliente). 
 
Pergunta​: Temos que fazer validação tanto no backend quanto no frontend? 
Resposta​: ​SIM!!!! 
Ao fazer validação no frontend conseguimos melhorar a usabilidade e performance 
para o cliente, pois os dados estão sendo validados no seu navegador e não ficamos 
acessando o servidor a todo momento. 
No caso do backend é obrigatório, pois é a última camada antes de armazenar os 
dados no banco de dados. 
 
Premissa: ​NUNCA CONFIE NOS DADOS ENVIADOS PELO USUÁRIO 
 
Validação no backend usando PHP 
 
No PHP podemos validar os dados usando funções e filtros disponíveis na própria 
linguagem. 
 
Seguem alguns exemplos de funções: 
 empty (verifica se variável está vazia) 
 is_numeric (verifica se variável é numérica) 
 is_string (verifica se variável é string) 
 strlen (verifica o tamanho da variável) 
 
Seguem alguns exemplos de filtros: 
FILTER_VALIDATE_EMAIL - valida se email é valido 
FILTER_SANITIZE_EMAIL - remove alguns caracteres que não faz parte do email 
FILTER_SANITIZE_SPECIAL_CHARS - escapa os caracteres especiais, não tratando como código 
 
Abaixo, seguem alguns links da documentação do PHP com todas as funções e filtros 
disponíveis. 
 
funções 
https://www.php.net/manual/pt_BR/book.var.php 
https://www.php.net/manual/pt_BR/ref.strings.php 
 
 
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
 
filtros de limpeza,​ evitando ataques ao sistema como SQL Injection 
https://www.php.net/manual/en/filter.filters.sanitize.php 
 
filtros de validação 
https://www.php.net/manual/en/filter.filters.validate.php 
 
Mão na massa 
 
Agora no nosso projeto de CRUD paciente, vamos inserir a validação no Backend 
usando funções e filtros no arquivo “paciente-action-inserir.php”, ficando dessa forma: 
 
Atenção: a função ​filter_input tem a mesma função do ​$_POST​, com a diferença que 
podemos usar um filtro nesse momento.Exemplo abaixo: 
 
DE -------> $cpf ​ = $_POST[ ​'cpf']; 
PARA -------> $cpf ​ = ​filter_input ​(INPUT_POST, ​'cpf' ​, FILTER_SANITIZE_NUMBER_INT); 
 
Segue exemplo do código “paciente-action-inserir.php”, ler os comentários do código 
<?php 
require_once ​( ​"cabecalho.php" ​); 
require_once ​( ​"banco-paciente.php" ​); 
 
//INICIAR A SESSAO 
session_start ​(); 
 
//PEGAR AS INFORMAÇÕES DO POST DO FORMULARIO E UTILIZAR FUNÇÕES DE LIMPEZA DE CONTEUDO 
$cpf ​ = ​filter_input ​(INPUT_POST, ​'cpf' ​, FILTER_SANITIZE_NUMBER_INT); 
$nome ​ = ​strtoupper ​( ​filter_input ​(INPUT_POST, ​'nome' ​, FILTER_SANITIZE_SPECIAL_CHARS)); 
$telefone ​ = ​filter_input ​(INPUT_POST, ​'telefone' ​, FILTER_SANITIZE_NUMBER_INT); 
$email ​ = ​filter_input ​(INPUT_POST, ​'email' ​, FILTER_SANITIZE_EMAIL); 
 
//variavel tipo array para armazenar todos erros de validação 
$erros ​ = ​array ​(); 
 
//VALIDAR CAMPOS DO FORMULÁRIO 
 
 ​//validar cpf 
 ​if ​ ( ​strlen ​( ​$cpf ​) < ​11 ​ or ​strlen ​( ​$cpf ​) > ​11 ​ or ! ​filter_var ​( ​$cpf ​, FILTER_VALIDATE_INT)): 
 ​$erros ​ [] = ​"CPF inválido" ​; 
 ​endif ​; 
 
 ​//validar nome 
 ​if ​ ( ​empty ​( ​$nome ​) || ​strlen ​( ​$nome ​) <= ​3 ​): 
 ​$erros ​[] = ​"Informar um nome com mais de 3 caracteres" ​; 
 ​endif ​; 
 
 ​//validar telefone 
 ​if ​ (! ​filter_var ​( ​$telefone ​, FILTER_VALIDATE_INT)): 
 
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
 ​$erros ​ []= ​"Telefone inválido" ​; 
 ​endif ​; 
 
 ​//validar email 
 ​if ​ (! ​filter_var ​( ​$email ​, FILTER_VALIDATE_EMAIL)): 
 ​$erros ​ []= ​"Email inválido" ​; 
 ​endif ​; 
 
 
 ​if ​ (! ​empty ​( ​$erros ​)) { 
 ​// entra aqui quando a variavel $erros não for vazia 
 ​// cria sessão com as mensagem de erros da validação 
 ​$_SESSION ​[ ​"validacao" ​] = ​$erros ​; 
 ​header ​( ​"Location: paciente-form.php" ​); 
 ​die ​(); 
 } ​elseif ​( ​inserirPaciente ​( ​$conexao ​, ​$cpf ​, ​$nome ​, ​$telefone ​, ​$email ​)){ 
 ​//entra aqui no caso de sucesso da query 
 ​$_SESSION ​[ ​"success" ​] = ​"Paciente cadastrado com sucesso." ​; 
 ​header ​( ​"Location: paciente-lista.php" ​); 
 } ​else ​{ 
 ​//entra aqui no caso de erro da query 
 ​$_SESSION ​[ ​"danger" ​] = ​"Erro ao cadatrar paciente." ​; 
 ​header ​( ​"Location: paciente-lista.php" ​); 
 }; 
 
 
Agora que estamos fazendo a validação e armazenando as mensagem de erro em 
uma sessão, 
$_SESSION​[​"validacao"​] = ​$erros​; 
o que devemos fazer para exibir a sessão ao redirecionar para página “paciente-form.php” 
em caso de algum erro de validação? 
 
Segue um link com alguns exemplos de validação para estudohttp://www.devwilliam.com.br/php/aprenda-como-validar-dados-com-php 
 
 
Replique as validações no arquivo “paciente-action-editar.php” 
 
 
 
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
Validação no frontend HTML5 
 
No frontend temos várias formas de validar os dados usando HTML5, java script, jQuery, 
Bootstrap 
 
usando HTML5 podemos usar: 
REQUIRED - campo obrigatório 
TYPE - NUMBER, TEXT, EMAIL, DATE, etc... 
PATTERN - uso de expressões regulares para definir um padrão na string 
 
Exemplo: 
< ​input ​type ​= ​"number" ​class ​= ​"form-control" ​id ​= ​"txtCpf" ​name ​= ​"cpf" ​placeholder ​= ​"digite seu 
CPF" ​ ​autofocus required ​ ​> 
 
< ​input ​type ​= ​"text" ​class ​= ​"form-control" ​id ​= ​"txtNome" ​name ​= ​"nome" ​placeholder ​= ​"digite seu 
nome" ​ ​pattern ​= ​"[A-Za-z ]{3,50}" ​ ​title ​= ​"O nome precisa ter pelo menos 3 caracteres" ​> 
 
mais exemplos de pattern HTML5: 
https://www.w3schools.com/tags/att_input_pattern.asp 
 
http://html5pattern.com/ 
Agora tenta incluir esses comandos na tag de <input> do seu formulário e tente enviar o 
formulário sem nenhuma informação digitada. O que acontece? 
 
Validação no frontend Bootstra​p 
 
Olhando a documentação do Bootstrap, vamos ver como fazer validação integrando 
HTML5, Bootstrap e javascript. 
 
https://getbootstrap.com.br/docs/4.1/components/forms/#valida%C3%A7%C3%A3o 
 
Devemos fazer a seguinte alteração no formulário para usar a validação do bootstrap 
integrado com HTML5, arquivo “paciente-form.php” 
 
Adicionar a classe na tag <form> 
class="needs-validation" novalidate 
 
Adicionar embaixo de cada <input> a div de ERRO 
< ​div ​ ​class ​= ​"invalid-feedback" ​> ​Por favor, informe um CPF. ​</ ​div ​> 
 
Adicionar embaixo de cada <input> a div de SUCESSO 
< ​div ​ ​class ​= ​"valid-feedback" ​> ​Tudo certo! ​</ ​div ​> 
 
 
https://www.w3schools.com/tags/att_input_pattern.asp
http://html5pattern.com/
https://getbootstrap.com.br/docs/4.1/components/forms/#valida%C3%A7%C3%A3o
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
Para finalizar incluir o código javascript para fazer a validação e uso das classes de ERRO e 
SUCESSO 
 
Incluir código abaixo do formulário 
 ​< ​script ​> 
 ​//SCRIPT BOOSTRAP PARA EXIBIR AS MENSAGEM DE VALIDAÇÃO 
 
​// Exemplo de JavaScript inicial para desativar envios de formulário, se houver campos 
inválidos. 
 ( ​function ​() { 
 ​'use strict' ​; 
 ​window ​. ​addEventListener ​( ​'load' ​, ​function ​() { 
​// Pega todos os formulários que nós queremos aplicar estilos de validação Bootstrap 
personalizados. 
 ​var ​ ​forms ​ = ​document ​. ​getElementsByClassName ​( ​'needs-validation' ​); 
 ​// Faz um loop neles e evita o envio 
 ​var ​ ​validation ​ = ​Array ​. ​prototype ​. ​filter ​. ​call ​( ​forms ​, ​function ​( ​form ​) { 
 ​form ​. ​addEventListener ​( ​'submit' ​, ​function ​( ​event ​) { 
 ​if ​ ( ​form ​. ​checkValidity ​() === ​false ​) { 
 ​event ​. ​preventDefault ​(); 
 ​event ​. ​stopPropagation ​(); 
 } 
 ​form ​. ​classList ​. ​add ​( ​'was-validated' ​); 
 }, ​false ​); 
 }); 
 }, ​false ​); 
 })(); 
 ​</ ​script ​> 
 
Validação no frontend - outras formas 
 
Existem outras formas de fazer validação utilizando javascript puro ou usando o framework 
jQuery. 
 
Seguem alguns links que podem te ajudar nessa tarefa: 
https://emersonbroga.com/validando-formularios-com-jquery-validate/ 
 
https://www.youtube.com/watch?v=cHpJ9f63XVw 
 
https://jqueryvalidation.org/ 
 
 
 
https://emersonbroga.com/validando-formularios-com-jquery-validate/
https://www.youtube.com/watch?v=cHpJ9f63XVw
https://jqueryvalidation.org/
<?PHP echo (“PHP Procedural - Fazendo um CRUD usando Bootstrap”); ?> 
 
 
Máscaras em campos de input do formulário 
 
Caso tenha interesse em colocar máscara no seu formulário, uma sugestão é utilizar o 
jQuery. 
 
Seguem alguns links para estudo: 
 
https://plugins.jquery.com/mask/ 
 
https://www.youtube.com/watch?v=KNYQzoMLJ5M 
 
 
https://plugins.jquery.com/mask/
https://www.youtube.com/watch?v=KNYQzoMLJ5M

Outros materiais