Web Sites com Ajax
JavaScript
Visão geral sobre as páginas
Ao se trabalhar com Ajax, temos duas opções: desenvolver as páginas para quem utilizará o sistema com e sem o Ajax separadamente ou, desenvoler uma única página que atenda as duas vertentes (com e sem Ajax).
A segunda é mais interessante, não é? Então, será com ela que iremos trabalhar neste curso.
Antes de lhe explicar a finalidade de cada página e o porquê de cada uma delas, vamos observar a estrutura do nosso diretório:
Agora, vamos conhecer a função de cada página e o porquê elas foram desenvolvidas para este projeto.
Seguindo a ordem da imagem apresentada acima, temos primeiramente o diretório css e dentro dele a página apresentacao.css. Ela é nossa camada de apresentação, a qual estiliza todo o nosso layout e esse é o seu propósito para este projeto.
Não faremos um detalhamento sobre o que há dentro dela, uma vez que as CSS não é o escopo deste curso.
O diretório img armazena as três imagens utilizadas no projeto: btnDelete.gif, btnEditar.gif e imgLoading.gif. No decorrer do projeto, veremos onde elas serão utilizadas.
No diretório includes temos duas importantes páginas: class.MySQL.php e functions.php. A primeira contém uma classe que desempenha as principais funções (conectar-se, realizar consultas, entre outras) no banco de dados MySQL. A segunda contém apenas duas funções, uma utilizada ao se trabalhar com Ajax e a outra sem Ajax. Elas têm a finalidade de evitar o SQL Injection e no caso da específico para Ajax, há um outro recurso referente aos acentos (falaremos melhor sobre isto).
Semelhante ao diretório css, o diretório js armazena a página comportamentos.js. Essa página representa a camada de comportamento responsável por toda interatividade com o usuário e, claro, para trabalharmos com o Ajax.
A página actions.php realizará as três principais funções do projeto: inserir, editar e excluir registros do banco de dados.
Já a página formulario.php contém o formulário que será utilizado para o cadastro e edição dos contatos da agenda.
A página index.php é a página principal, a qual será a responsável pela camada de conteúdo e onde ocorrerá todo o trabalho em nossa agenda de contato.
E, finalizando, a página relatorio.php exibe o relatório dos cadastrados em nossa agenda.
