Criando um “CRUD” com FormDin O objetivo deste exemplo é criar uma aplicação utilizando a framework FormDin, que permita fazer faz er a manutenção completa em uma tabela, ou seja, nclusão, !onsulta, !o nsulta, "lteração "lt eração e a #xclusão de re$istros, o que c%amamos de !&'D ( !reate )criar*, &etrieve )recuperar*, 'pdate )atualizar* e Delete )excluir*+ "consel%o ler o anual de nstalação e fazer a instalação do FormDin antes de começar com este exerc-cio+ O Projeto
O projeto consistir. em criar um cadastro de ve-culos e um relat/rio em pdf, com os se$uintes campos0 a1 b1 c1 d1 e1 f1 $1 %1 i1
2laca 3 campo 4exto com .scara1 5ome 3 campo 4exto 1 arca 3 campo 4exto 1 odelo 3 campo 4exto 1 "no Fabricação 3 campo nteiro 1 !or 3 campo 4exto 1 6alor 3 campo 5umérico 1 Data "quisição 3 campo Data 1 Observação 3 campo emo 1
O banco de dados utilizado ser. o 789ite :, devido a sua simplicidade e não precisar de instalação , e todos poderão executar o exemplo sem problemas+ A Aplicação
" aplicação ser. c%amada de 7istema de !adastro de 6e-culos ; 7!"6, dever. possuir um menu principal com as se$uintes opç etapas, e poderei explicar mel%or cada uma delas+ ?@1 !onfi$uração da "plicação 34"pplication1A B@1 !onfi$uração da !onexão com banco de dados 342DO!onnection1A :@1 !riação do enu 2rincipal 3 4D%tmlxenu 1A C@1 !riação do formul.rio de cadastro de ve-culos 3 4Form 1 e >@1 !riação do relat/rio utilizando a classe 42DF que é uma extensão da classe fpdf+ #ntão vamos l.+ 1º Passo ; !riação da "plicação ( crie o arquivo indexp!p" que ser. o nosso controlador respons.vel pela criação da interface da aplicação e o tratamento das requisiç
( crie um diret/rio c%amado sica#$ no diret/rio htdocs ou htdocs ou www do www do apac%e ou onde desejar, de forma que ele seja acessado pelo nave$ador através do apac%e+ 5o meu exemplo criarei dentro do diret/rio c0xampp%tdocs, ficando min%a url de acesso %ttp0EElocal%ostEsicavE
Página 1
Criando um “CRUD” com FormDin (crie no diret/rio sica#$ o subdiret/rio %ancoDados$ e utilizando qualquer &D' para o ()*ite, aqui estou utilizando a (+*ite Admin 3 %ttp0EEsqliteadmin+orbmuBk+deE 1, crie um banco de dados c%amado %dCruds,d% e também a tabela t%-#eiculo conforme o script abaixo0 CREATE TABLE [tb_veiculo] ( [id] INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT [!l"c"] v"#c$"#(%& UNI'UE NOT NULL [o)e] v"#c$"#(*++& NOT NULL [)"#c"] v"#c$"#(,+& NULL [)odelo] v"#c$"#(,+& NULL ["o] ite-e# NULL [co#] v"#c$"#(.+& NULL [v"lo#] u)e#ic(*+.& NULL ["/ui0ic"o] d"te NULL [ob0e#v"c"o] te1t NULL &
Dentro do diret/rio sica#$, crie um arquivo c%amado indexp!p com o se$uinte c/di$o0 23!$! #e/ui#e_oce(4556b"0e6cl"00e067eb8o#)6TA!!lic"tio5cl"005!$!4&9 :"!! ; e7 TA!!lic"tio(4culo044E1e)!lo CRU? co) @o#)?i44
.º Passo / !onfi$uração da conexão "ntes de executarmos o c/di$o acima, vamos confi$urar e testar a conexão com o banco de dados 7q9ite+
( crie outro subdiret/rio c%amado includes$ dentro de sica#$ e dentro dele o arquivo con0i-conexaop!p+ #ste é o subdiret/rio e o arquivo que a classe 2PDOConnection -r. procurar quando for solicitada al$uma operação com banco de dados+
Página 2
Criando um “CRUD” com FormDin ( adicione o se$uinte c/di$o0 de8ie(4BANCO44<'LITE4&9 de8ie(4?ATABA
( deixe a lin%a TP?OCoectiote0t(& ; do arquivo indexp!p descomentada e execute a aplicação+ 7e estiver utilizando o linux, certifique(se de que o "pac%e tem permissão de leitura nos diret/rios e subdiret/rios da aplicação e também de escrita nos subdiret/rios dao/ e base/tmp. ( se tudo estiver correto dever. aparecer no nave$ador a mensa$em abaixo0
Conexão com (+*&2' est3 O45555 ( comente novamente a lin%a 66TP?OCoectiote0t(); do index+p%p, para remover o teste de conexão, e a aplicação ser executada normalmente+ ,º Passo 6 !riação do enu 2rincipal+ 2ara criarmos o menu principal, crie um arquivo c%amado menu_principal.php dentro do subdiret/rio includesE com o se$uinte c/di$o0 23!$! :)eu ; Ne7 TMeu?$t)l1(&9 :)eu"dd(*+4C"d"0t#o4ullull48olde#Aul5-i84&9 :)eu"dd(***4=e>culo044c"d_veiculo4ull48olde#AulO!e5-i84&9 :)eu"dd(.+4Rel"tH#io04ullull4!#it*5-i84&9 :)eu"dd(.*.4=e>culo044#el_veiculo4ull4!#it*5-i84&9 :)eu"dd(Q+4Ge#"do# ?AO6=O44b"0e6iclude06-e#"do#_vo_d"o5!$!4&9 :)eu-et)l(&9 6SS S Ob0e#v"Fe0 S A0 i)"-e0 utili"d"0 o )eu e0tJo o di#etH#io b"0e6i)"-e05 P"#" utili"# S i)"-e0 de out#o di#etH#io co8i-u#e o c")i$o /ue deve# 0e# utili"do S o ide15!$! co) o 0e-uite co)"do :"!!0etMeuIco0P"t$(4c")i$o64&9 S S A c#i"FJo do )eu )uito 0i)!le0 0edo S id do ite) S id do !"i S titulo S $it S i)"-e) S etc555 S P"#" " c#i"FJo d" $ie#"#/ui" )"u"l)ete eu utiliei o0 id0 co)o 0e 8o00e u)" li0t" u)e#"d" 0e) o0 !oto05 S A00i) S ite) * ; * S ite) *5* ; ** S ite) . ; . S ite) .5* ; .* S6 3
7º Passo / !riação do formul.rio de cadastro de ve-culos+
( crie o subdiret/rio modulos$ e dentro dele outro subdiret/rio com o nome cad-#eiculo$+ #sta é a estrutura su$erida para or$anizarmos a aplicação por m/dulos+ !ada m/dulo tem seu subdiret/rio com seus respectivos arquivos p!p" css" js entre outros+ 4oda vez que o m/dulo
Página 3
Criando um “CRUD” com FormDin for c%amado, a classe 2Form procurar. pelos arquivos js e css com o mesmo nome do m/dulo trocando a extensão para js e css, se existirem, serão adicionados automaticamente p.$ina+ Outros arquivos js e css podem ser adicionados sempre que necess.rios através dos métodos0 add8sFile9:xxxjs;< e addCssFile9:xxxcss;< da classe 2Form ( crie o arquivo cad-#eiculop!p dentro do diret/rio m=dulos$cad-#eiculo$+ "dicione o c/di$o abaixo salve o arquivo, execute a aplicação e clique na opção do menu0 Cadastro6>?e@culo 23!$! :8#) ; e7 T@o#)(4C"d"0t#o de =iculo04&9 :8#)0$o7(&9 3
" tela abaixo dever. aparecer0
( iremos adicionar os campos ao formul.rio+ 2ara enriquecer o exemplo e explorar os recursos do FormDin, dividiremos o formul.rio em duas abas, sendo a primeira aba c%amada de Cadastro e a se$unda aba de *istaem+ 5a primeira colocaremos os campos e na se$unda uma ride que permita listar os ve-culos j. cadastrados e com as aç
Página 4
Criando um “CRUD” com FormDin ( retornemos ao c/di$o fonte do arquivo cad-#eiculop!p e altere para que fique com as se$uintes lin%as0 3o que est. em ne$rito é o que foi adicionado ao c/di$o j. existente 1 23!$! :8#) ; e7 T@o#)(4C"d"0t#o de =iculo04&9
// adicionar o campo hidden para a coluna chave da tabela. $frm->addHiddenField('id'); // adicionando abas ao formulário $pc $frm->add!a"e#ontrol('pc'); // criar instncia do controlador de pá"inas // adicionar a pa"ina %#adastro% $pc->add!a"e('#adastro'&true&true&'aba#adastro'); // a partir daui& tudo ue for adicionado ao form ficará dentro da aba at encontrar o metodo closeroup(); // adicionar os campos na aba cadastro $frm->add*as+Field('placa'&', da !laca'&true&'aaa-'); $frm->add0e1tField('nome'&',ome'&233&true&43); $frm->add0e1tField('marca'&'*arca'&53); $frm->add0e1tField('modelo'&'*odelo'&53&false&null&null&false); $frm->add,umberField('ano'&'6no'&7&false&3); $frm->add0e1tField('cor'&'#or'&83&null&null&null&false); $frm->add,umberField('valor'&'9alor :$'&23&false&8); $frm->addateField('auisicao'&'ata 6uisi<=o'&false); $frm->add*emoField('observacao'&'bservaaddAutton('Balvar'&'salvar'&'btnBalvar'&null&null&true&false); $frm->addAutton('Cimpar'&'limpar'&'btnCimpar'&null&null&false&false); // para e1emplificar o uso do campo html e da inclus=o de um aruivo css e1terno $frm->addHtmlField('mensa"em'&'Dbr>Dcenter>Db>Dspan class%Fonte9ermelha%>#ampos em vermelho s=o de preenchimento obri"atErioD/span>D/b>D/center>'); // adicionar a aba Cista"em $pc->add!a"e('Cista"em'); $frm->addHtmlField('html"ride'&'6ui será carre"ado o "ride'); // processar as aprocess6ction(); // criar<=o do "ride $" neG 0rid( '"d' // id do "ride no html &'Cista"em dos 9eculos' // titulo do "ride &0bveiculo6select6ll('nome') // arraI de dados &null &null &'J'); // chave da tabela); // adicionando o obKeto ao campo html criado acima $frm->set('html"ride'&$"); // ou $frm->"etField('"ride')->add($"); // e1ibir o formulário :8#)0$o7(&9 3
( execute novamente a aplicação ou atualize a p.$ina do nave$ador 3F>1, se j. estiver com a aplicação executando+ " tela deve ser a se$uinte0
Página 5
Criando um “CRUD” com FormDin
( devemos fazer o tratamento das açaddButton3 H7alvarH ,sal#ar, +++1 e 0rm6>addButton3 H7alvarH ,limpar, +++1+ 7e estiver utilizando o linux, lembre(se de verificar os direitos de acesso para o apac%e, a sempre que criar um diret/rio ou arquivo+ ( antes de prosse$uirmos com a codificação, criaremos as classes DAO e ?O da tabela t%-#eiculos, que serão as respons.veis pelas operaç
+++ :)eu"dd(Q+4Ge#"do# ?AO6=O44b"0e6iclude06-e#"do#_vo_d"o5!$!4&9
+++ ( atualize a p.$ina no nave$ador 3F>1, e dever. aparecer o item erador DAO$?O, conforme a ima$em do menu abaixo0
Página 6
Criando um “CRUD” com FormDin ( clique na opção erador DAO$?O para exibir a tela abaixo+
0 ( 6amos preenc%L(la assim0 a1 diret/rio não precisa alterar deixe com0 dao$ b1 nome da tabela0 t%-#eiculo c1 nome da coluna c%ave0 id d1 colunas0 id"placa"nome"marca"modelo"ano"cor"#alor"a)uisicao"o%ser#acao Os nomes das colunas também podem ser informados, um em baixo do outro, utilizando o Menter= como delimitador e retirando as vir$ulas+ ( ap/s preenc%imento dos campos, clique no botão Nerar e a$uarde a mensa$em F+ Fec%e a tela e verifique se no subdiret/rio sica#$dao foram criados os arquivos0 2%-#eiculoDAOclassp!p e 2%-#eiculo?Oclassp!p+
( caso ocorra al$um problema, verifique os direitos de acesso para o apac%e nos diret/rios e arquivos+ 4ente criar o subdiret/rio sica#$dao manualmente e dar os direitos de escrita e leitura para o apac%e+
Página 7
Criando um “CRUD” com FormDin ( a$ora prosse$uiremos com a codificação das aç")o0 /ue utili"# o0 )todo0 0et0 do obeto vo !"#" c"d" c")!o5 E1e)!lo :vo0etId(:8#)-et(4id4&&9 :vo0etPl"c"(:8#)-et(4!l"c"4&&9 :vo0etNo)e(:8#)-et(4o)e4&&9 555 S6 :8#)0et=o(:vo&9 66 G#"v"do o d"do o b"co de d"do0 i8( tb_veiculo?AOi0e#t(:vo& & :8#)0etMe00"-e(4=e>culo 0"lvo co)
( abra o arquivo action$limparp!p e adicione o se$uinte c/di$o0 23!$! 66 li)!"# todo0 o0 c")!o0 do 8o#)ul#io5 :8#)cle"#@ield0(&9 3
( vamos testar a inclusão+ #xecute a aplicação e faça o cadastro de um ve-culo+ 7e estiver tudo funcionando corretamente, ap/s clicar no botão 7alvar, a se$uinte mensa$em de confirmação dever. aparecer0
Página 8
Criando um “CRUD” com FormDin ( pr/ximo passo ser. fazer a lista$em dos ve-culos na aba 9ista$em, com as açprocessAction9< adicione o c/di$o abaixo, para criação do ride e exibição na p.$ina+ 66 c#i"FJo do -#ide :- ; e7 TG#id( 4-d4 66 id do -#ide o $t)l 4Li0t"-e) do0 =e>culo04 66 titulo do -#ide Tb_veiculo?AO0electAll(4o)e4& 66 "##"W de d"do0 ull ull 4I?4&9 66 c$"ve d" t"bel" 66 "dicio"do o obeto -#ide "o c")!o $t)l c#i"do "ci)" det#o d" "b" Li0t"-e) :8#)0et(4$t)l_-#ide4:-&9 66 ou t")b) :8#)-et@ield(4-#ide4&"dd(:-&9
( atualize a p.$ina e clique na aba 9ista$em+ 7e j. existir dados na tabela, o ride dever. aparecer conforme a tela abaixo, com seus dados0
( por padrão, a classe 2ride utiliza os nomes como t-tulo das colunas e os bot
Página 9
Criando um “CRUD” com FormDin ( crie o arquivo modulos$cad-#eiculo$action$d-alterarp!p e adicione o se$uinte c/di$o0 23!$! 66 #ecu!e#"# o ve>culo !elo id 0elecio"do o -#ide :d"do0 ; Tb_veiculo?AO0elect(:8#)-et(4id4&&9 66 "tu"li"# o0 c")!o0 do 8o#) co) o0 d"do0 do ve>culo :8#)u!d"te(:d"do0&9 6S Obe0e#v"FJo co)o o0 o)e0 do0 c")!o0 d" t"bel" 0Jo o0 )e0)o0 do 8o#)ul#io !ode)o0 utili"# o )todo :8#)u!d"te(:d"do0&9 c"0o cot##io te#>")o0 /ue 8"e# c")!o " c")!o5 E1e)!lo :8#)0et(4id4:d"do0[4I?4][+]&9 :8#)0et(4!l"c"4:d"do0[4PLACA4][+]&9 :8#)0et(4o)e4:d"do0[4NOME4][+]&9 555 S6 66 de8ii# " "b" iici"l !"#" " "b" C"d"0t#o :8#)-et@ield(4!c4&0etActiveP"-e(4"b"C"d"0t#o4t#ue&9 3
( crie o arquivo modulos$cad-#eiculo$action$d-ecluirp!p e adicione o se$uinte c/di$o0 23!$! Tb_veiculo?AOdelete(:8#)-et(4id4&&9 3
Hº Passo ( !riação do relat/rio utilizando a classe 42DF
4erminamos aqui o nosso CRUD" podemos a$ora fazer a nosso relat/rio em PDF com a lista$em dos ve-culos+ ( dentro do diret/rio modulos$ crie o subdiret/rio rel-#eiculo$ e dentro dele o arquivo rel-#eiculop!p com o se$uinte c/di$o0 23!$! :8#) ; e7 T@o#)(4Rel"tH#io de =e>culo04.++&9 66 "dicio"# u) -#u!o co) +!1 " !#i)ei#" colu" vi#tu"l !"#" o0 i!ut0 8ic"#e) )"i0 !#H1i)o0 do0 #Htulo0 :8#)"ddG#ou!@ield(4-!@ilt#o44CodiFJo4&0etColu)0(+&9 :8#)"ddTe1t@ield(4)"#c"44M"#c"4,+&9 :8#)"ddNu)be#@ield(4"o44Ao4Xull+&9 :8#)clo0eG#ou!(&9 :8#)"ddButto(4=i0u"li"#4ull4bt=i0u"li"#44-e#"#Pd8(&44Co8i#)" " C#i"FJo do Rel"tH#io 34&9 66 !#oce00"# " "c"o c#i"#_!d8 :8#)!#oce00Actio(&9 66 e1ibi# o 8o#)ul#io :8#)0$o7(&9 3 20c#i!t 8uctio -e#"#Pd8(& 66 "b#i# "el" )od"l !"#" e1ibi# o !d8 det#o de u) i8#")e 87<$o7Pd8(tituloLi0t"-e) de =e>culo0"c"oc#i"#_!d8"o)"#c"V &9 V 260c#i!t
Página 10
Criando um “CRUD” com FormDin ( em se$uida crie o subdiret/rio action$ dentro do subdiret/rio modulos$rel-#eiculo$ e dentro dele o arquivo criar-pd0p!p, esta ser. nossa ação para $erar o pdf+ "dicione o c/di$o abaixo0 23!$! 66 vou 8"e# u) e1e)!lo de co)o e1ecut"# u)" co)"do 0/l di#et")ete " c")"d" de vi0Jo 66 0e) !"00"# !el" c")"d" )odel5 NJo 8"F") i00o 0o)ete !"#" e1e)!li8ic"#5 66 O co##eto 0e# c#i"# o )todo #el"to#io(& !o# e1e)!lo o 66 "#/uivo d"o6Tb_veiculo?AO5cl"005!$! /ue #eto#" o "##"W de d"do0 :0/l ; 0elect S 8#o) tb_veiculo 7$e#e id + 9 :!"#")et#o0;"##"W(&9 i8( :_RE'UEculo ecot#"do26cete#26$,49 die(&9 V 66 c#i"FJo do obeto !d8 :!d8 ; e7 TP?@(4L4&9 66 " cl"00e TP?@ !#ocu#" !el" 8uFJo c"bec"l$o(& e 0e e1i0ti# 0e# e1ecut"d" #ecebedo " i0tZci" d" cl"00e TP?@ 8uctio c"bec"l$o(:!d8& :!d80et@ot(444B4*X&9 :!d8cell(+4culo0 =*5+4+*4C4&9 :!d80et@ot(444B4*.&9 :!d8cell(+4Li0t"-e) do0 =e>culo04+*4C4&9 :!d8l(*&9 :!d80et@ot(4444*+&9 :c#ite#io ; 449 i8( :_RE'UEculo04 :c#ite#io &9 :!d8cell(+4C#it#io de co0ult" 45:c#ite#io+*4L4&9 :!d8l(*&9 V 66 " cl"00e TP?@ !#ocu#" !el" 8uFJo #od"!e(& e 0e e1i0ti# 0e# e1ecut"d" #ecebedo " i0tZci" d" cl"00e TP?@ 8uctio #od"!e(:!d8& :!d80etY(:!d8$*+&9 :!d8cell(+4E)i00Jo 45d"te(4d6)6Y $i04& 4T4+4L4&9 :!d8cell(+4P-i" 45:!d8P"-eNo(&54 de bV4 4T4+4C4&9
Página 11
Criando um “CRUD” com FormDin V 66 "dicio"# o "##"W de d"do0 "o obeto !d8 :!d80et?"t"(:d"do0&9 66 c#i"FJo do co#!o do #eltH#io /ue e0te c"0o 0e# u)" li0t"-e) 0i)!le0 ti!o t"bel" ( -#ide & 66 "dicio"# "0 colu"0 /ue i#e)o0 li0t"# d" t"bel"5 :!d8"ddColu)(4Pl"c"4 *4C4 4PLACA4 47$ite4ull%4bl"cD4 4ti)e04&9 :!d8"ddColu)(4No)e4 +4L4 4NOME4 47$ite44B4%4bl"cD4 4"#i"l4&9 :!d8"ddColu)(4M"#c"4 .+4L4 4MARCA4 47$ite4ull%4bl"cD4 4"#i"l4&9 :!d8"ddColu)(4Modelo4 .+4L4 4MO?ELO4 47$ite4ull%4bl"cD4 4"#i"l4&9 :!d8"ddColu)(4Ao4 *+4C4 4ANO4 47$ite4ull%4blue4 4"#i"l4&9 :!d8"ddColu)(4="lo#4 .+4R4 4=ALOR4 47$ite4ull%4bl"cD4 4"#i"l4&9 :!d8"ddColu)(4A/ui0iFJo4 .+4C4 4A'UI
2ara testar o relat/rio, clique no botão 6isualizar+ " lista$em dever. aparecer conforme a tela abaixo0
em pessoal, espero ter ajudado a compreender mel%or o funcionamento da framework , no pr/ximo exemplo vou converter este exemplo todo para o padrão "P"Q, ou seja, todas as aç
Página 12