O GUIA PRÁTICO DO DREAMWEAVER CS3

Transcrição

1

2

3 CENTRO ATLÂNTICO O GUIA PRÁTICO DO DREAMWEAVER CS3 com PHP, JAVASCRIPT E AJAX

4

5 PEDRO REMOALDO O GUIA PRÁTICO DO DREAMWEAVER CS3 com PHP, JAVASCRIPT E AJAX Portugal/2008

6 Reservados todos os direitos por Centro Atlântico, Lda. Qualquer reprodução, incluindo fotocópia, só pode ser feita com autorização expressa dos editores da obra. O GUIA PRÁTICO DO DREAMWEAVER CS3 COM PHP, JAVASCRIPT E AJAX Colecção: Tecnologias Autor: Pedro Remoaldo Direcção gráfica: Centro Atlântico Revisão técnica: Centro Atlântico Capa: Paulo Buchinho Centro Atlântico, Lda., 2008 Av. Dr. Carlos Bacelar, 968 Escr. 1 A V. N. Famalicão Rua da Misericórdia, Lisboa Portugal Tel geral@centroatlantico.pt Impressão e acabamento: Inova 1ª edição: Fevereiro de 2008 ISBN: Depósito legal: /08 Marcas registadas: Todos os termos mencionados neste livro conhecidos como sendo marcas registadas de produtos e serviços foram apropriadamente capitalizados. A utilização de um termo neste livro não deve ser encarada como afectando a validade de alguma marca registada de produto ou serviço. O Editor e o Autor não se responsabilizam por possíveis danos morais ou físicos causados pelas instruções contidas no livro nem por endereços Internet que não correspondam às Home- -Pages pretendidas. O Guia Prático do Dreamweaver CS3 com PHP, JavaScript e Ajax é uma publicação independente não filiada na Adobe Systems Incorporated.

7 ÍNDICE Prefácio 21 Introdução 21 Público-alvo e pré-requisitos 21 Características principais do livro 22 Convenções usadas 22 Visão geral e Organização 23 Sobre o Autor 27 1 Desenvolvimento de sites Web Páginas estáticas Páginas interactivas Tecnologias client-side Camada conteúdo HTML Camada apresentação CSS Camada comportamento JavaScript JavaScript ECMAScript (ECMA-262) A evolução da linguagem JavaScript Desactivar o client-side scripting DHTML e DOM Scripting Páginas dinâmicas 38

8 8 O GUIA PRÁTICO DO DREAMWEAVER CS3 COM PHP, JAVASCRIPT E AJAX Metodologia das três camadas Tecnologias Ambientes de desenvolvimento e produção Apache, PHP e MySQL Apache PHP MySQL Ajax AJAX no Dreamweaver CS Definição de sites no Dreamweaver Criação de um site Dreamweaver Atribuição de um nome ao site Selecção da tecnologia de servidor Edição de ficheiros Servidores locais, remotos e de teste URL Prefix Remote site Root folders Trabalhar num ambiente colaborativo Confirmação das selecções efectuadas Testar o site Alteração de um site Local Info Remote Info Testing Server Editar um remote site Gestão de ficheiros Abrir, manipular e localizar ficheiros Check in e check out de ficheiros Obter e enviar ficheiros Sincronizar ficheiros Trabalhar com um mapa do site Site cloaking Design Notes Gestão de sites 89

9 ÍNDICE 9 3 Trabalhar com código no Dreamweaver Code View Code Hints Design View Split View Code Inspector Coder Layout versus Designer Layout Coding toolbar Outras opções para formatação do código Word Wrap Syntax coloring Hidden Characters Indentação Formatação de código Opções de Code Rewriting Tipos de letra Outras operações Pesquisar Imprimir o código Utilizar um editor de código externo Painel Snippets Adicionar um novo snippet Inserir um snippet na página Editar um snippet existente Eliminar um Snippet Partilhar um snippet Associar atalhos por teclado a snippets Utilizar a Code Reference A linguagem JavaScript Utilizar JavaScript em páginas Web Regras sintácticas da linguagem JavaScript Utilização de comentários Variáveis Atribuição de valores a variáveis 128

10 10 O GUIA PRÁTICO DO DREAMWEAVER CS3 COM PHP, JAVASCRIPT E AJAX 4.5 Tipos de dados Dados booleanos Dados numéricos inteiros Dados numéricos de vírgula flutuante Sequências de caracteres Apresentar informação no browser Operadores Operadores aritméticos Concatenação de strings Estruturas de controlo if Expressões e condições switch while do while for Funções Definir e invocar uma função Utilização de parâmetros Valores de retorno Funções internas Esfera de acção (scope) Objectos Conceitos básicos Objectos predefinidos Criação de classes e instanciação de objectos Manipulação de objectos O objecto array Métodos O objecto String O objecto Math Propriedades Métodos O objecto Date O objecto RegExp Tratamento e depuração de erros O comando try catch Excepções e o comando throw O evento onerror 158

11 ÍNDICE Utilização de comentários Depuração de erros utilizando browsers Document Object Model Evolução e versões do DOM Nós e estrutura da árvore do DOM Aceder aos nós Utilizar o DOM Level Utilizar o W3C DOM Navegar a árvore DOM Localizar um pai Localizar filhos Localizar irmãos Obter informação Obter o valor de um atributo Atribuir valores Mudar estilos Alterar estilos recorrendo a classes Inserir e remover elementos na árvore DOM Propriedades do objecto document Browser Object Model O objecto window Dimensões do ecrã e da janela do browser Mover, redimensionar e fazer scrolling da janela Focus e blur Trabalhar com janelas de pop-up Navegação O objecto navigator alert, confirm e prompt Eventos Eventos e event handlers Eventos disponíveis Criar event handlers Acções por omissão e valores de retorno Invocar explicitamente os event handlers 193

12 12 O GUIA PRÁTICO DO DREAMWEAVER CS3 COM PHP, JAVASCRIPT E AJAX Problemas com os event handlers Event listeners Eventos no Dreamweaver Exemplos Combinar eventos com CSS JavaScript no Dreamweaver CS Inserir scripts No script Secção Head Eventos Alterar um script Ficheiros Javascript externos Visualizar páginas no Internet Explorer Ajuda sobre o JavaScript Snippets JavaScript Behaviors Behaviors, eventos e acções Utilizar behaviors O painel BEHAVIORS Criar uma behavior Gerir eventos Invocar funções personalizadas Swap Image e Swap Image Restore Swap Image Restore Preload Images Rollover Image Exemplo Call JavaScript Trabalhar com janelas de pop-up Show-Hide Elements Set Text Set Text of Container Set Text of Frame 243

13 ÍNDICE Set Text of Status Bar Set Text of Text Field Check Plugin Go to URL Drag AP Element Pop-up message Spry Effects Appear/Fade Blind Grow/Shrink Highlight Shake Slide Squish Behaviors deprecated Utilizar outras behaviors Instalar behaviors Elementos de navegação Navigation Bar Set Nav Bar Jump Menu e Jump Menu Go Spry Widgets Spry Menu Bar Alterar o aspecto de uma Spry Menu Bar Remover uma SPRY MENU BAR Spry Tabbed Panel Formatar os painéis Spry Accordion Panel Formatar um Spry Accordion Panel Spry Collapsible Panel Formatar a aparência de um SPRY COLLAPSIBLE PANEL 303

14 14 O GUIA PRÁTICO DO DREAMWEAVER CS3 COM PHP, JAVASCRIPT E AJAX 10 Trabalhar com Formulários Validate Form Validação com widgets Spry Utilizar widgets de validação com tabelas Spry Validation Text Field Preview States Criar padrões personalizados de validação Alterar a aparência dos campos e das mensagens Spry Validation Textarea Alterar a aparência dos campos e das mensagens Spry Validation Checkbox Alterar a aparência das mensagens Spry Validation Select Alterar a aparência dos campos e das mensagens Utilizar JavaScript para aceder aos campos dos formulários Melhorar a behavior Validate Form Interacção entre campos de um formulário Animação e timelines Timelines Algumas regras O painel TIMELINES Adicionar elementos AP e imagens ao painel TIMELINES Criar animações Alterar as sequências de animação Adicionar keyframes Remover elementos da timeline Mudar a velocidade da animação Gravar o caminho de um elemento AP Desencadear behaviors nas timelines Criar um slideshow Utilizar múltiplas timelines Copiar e colar animações Aplicar uma sequência de animação a um objecto diferente 356

15 ÍNDICE Instalar o Apache, PHP e MySQL Apache Instalação do Apache Testar a instalação do Apache em Windows Ficheiros de configuração Aplicar alterações PHP Instalar o PHP em Windows Ficheiro de configuração php.ini MySQL Instalação em Windows Configuração Executar o MySQL como um serviço Windows Testar a instalação MySQL Configurar o PHP para trabalhar com o MySQL Pacotes integrados A linguagem PHP Utilizar PHP em páginas Web Utilização de comentários Variáveis Tipos de dados Apresentar informação no browser Operadores Estruturas de controlo Arrays Funções Esfera de acção (scope) Variáveis locais (local variables) Variáveis globais (global variables) Parâmetros de funções (function parameters) Variáveis estáticas (static variables) Variáveis superglobais Formulários e querystrings Querystrings Inclusão de ficheiros 396

16 16 O GUIA PRÁTICO DO DREAMWEAVER CS3 COM PHP, JAVASCRIPT E AJAX Objectos XML Trabalhar com PHP no Dreamweaver Server behaviors Objectos PHP Form Variables URL Variables Session Variables Cookie Variables Include Require PHP Page Encoding Code Block Echo Comentários If e Else Criar e utilizar bases de dados Administração do MySQL Ferramentas da linha de comandos Ferramentas gráficas MySQL Administrator MySQL Query Browser phpmyadmin MySQL Workbench Criar bases de dados e tabelas Utilizar o MySQL Administrator Utilizar o phpmyadmin para criar tabelas Tipos de dados Conversão de bases de dados MySQL Migration Toolkit Listar o conteúdo das tabelas MySQL Query Browser phpmyadmin Cópias das bases de dados Utilizando a linha de comandos 444

17 ÍNDICE Utilizando o MySQL Administrator Utilizando o phpmyadmin Definição de utilizadores e permissões MySQL Administrator Utilitário mysql Estabelecer ligações com o MySQL a partir do Dreamweaver Aceder a dados de uma base de dados MySQL utilizando PHP Criar um recordset Código produzido pelo Dreamweaver Apresentar dados numa página Paginação dos resultados Informação sobre os resultados Seleccionar uma página de resultados Criar uma relação mestre-detalhe Página Mestre Página Detalhe Processo automático Funcionalidades adicionais Pesquisar informação Apresentação dos resultados Funcionalidades adicionais Elementos dinâmicos Lista de países Produzir os resultados Manipular dados Inserção de dados Criação do formulário de inserção de dados Código produzido pelo Dreamweaver Validação dos dados introduzidos Actualização de dados Selecção dos dados a serem alterados Apresentar os dados a serem alterados Testar o formulário Update Record 532

18 18 O GUIA PRÁTICO DO DREAMWEAVER CS3 COM PHP, JAVASCRIPT E AJAX Código produzido pelo Dreamweaver Alterações ao formulário Validação dos dados alterados Cancelar a alteração dos dados Eliminação de dados Autenticação de utilizadores Base de dados com informação sobre os utilizadores Página inicial Registo de utilizadores Formulário de registo Validação do preenchimento dos campos Alterações de funcionamento Inserir os dados na base de dados Testar a introdução de valores em PHP Testar a existência de valores na tabela de utilizadores Gestão de erros Determinar o código de utilizador Autenticação de utilizadores Validar o utilizador Campos de preenchimento obrigatório Gestão de erros Código produzido pela server behavior Log In User Sessões Alterações à página index.php Logout Restringir o acesso às páginas do sítio Web Restringir acesso a áreas de páginas Editar os dados do utilizador Gestão dos erros Validação dos valores introduzidos no formulário Alteração da palavra-passe Validação automática do utilizador Utilização de cookies 586

19 ÍNDICE Utilização avançada do PHP Upload de ficheiros e utilização de imagens Criação das tabelas Criação da página autores.php Criação da página livros.php Página com informação sobre os livros Utilização de correio-electrónico Esqueci-me da palavra-passe Activação de contas em sítios Web Newsletters Dreamweaver Developer Toolbox AJAX XML Criar um ficheiro XML Formatar dados XML com XSLT Integrar dados XML numa página utilizando a Spry framework Estabelecer uma ligação com dados XML Definir regiões Spry Associar elementos à página Repetir dados Trabalhar com tabelas Spry Adicionar uma Detail Region Elementos XML Nested Gerar XML dinamicamente utilizando PHP Utilizar ficheiros XML dinâmicos com a Spry framework 676

20

21 Prefácio Introdução O desenvolvimento de sítios Web, partilhado, entre outros, por informáticos, designers, arquitectos de informação e profissionais de marketing, tem sido uma das actividades que mais alterações tem sofrido ao longo dos seus poucos anos de existência. As páginas Web foram sempre evoluindo, passando de estáticas para interactivas e depois para dinâmicas, podendo ser personalizadas por utilizador e suportadas por sofisticados acessos a bases de dados. Originalmente criadas em simples editores de texto, com o desenvolvimento das tecnologias utilizadas para a criação de páginas cada vez mais complexas foram surgindo aplicações para simplificar o trabalho dos Web Designers e dos Web Developers. O Adobe Dreamweaver é uma das aplicações que, ao longo de diversas versões, soube acompanhar a evolução dos sítios Web. Considerado, durante bastante tempo, uma ferramenta para Web Designers, o Dreamweaver tem vindo a apresentar argumentos para a sua utilização no desenvolvimento de sofisticados sites interactivos e dinâmicos. A integração e suporte de tecnologias como o JavaScript, o ASP, o ASP.NET, o PHP, o JSP e o Coldfusion, acelerou a sua divulgação e utilização ao nível profissional. Com a versão CS3 a integração da Spry framework tornou mais fácil a criação de interfaces sofisticadas e interactivas com recurso a JavaScript e ao AJAX. Mas o Dreamweaver é apenas uma das ferramentas que têm de ser utilizadas para o desenvolvimento de sítios Web. É necessária a utilização de servidores Web e servidores aplicacionais, linguagens de programação e sistemas de gestão de bases de dados. Nesse sentido, nada melhor do que recorrer à oferta open-source (código aberto) que lidera neste momento o mercado aplicacional Web: Apache, PHP e MySQL. Público-alvo e pré-requisitos Este livro é destinado a todos os Web Developers, existentes ou potenciais, que pretendam utilizar tecnologias recentes na criação de sítios Web interactivos e dinâmicos. Tem também interesse para os Web Designers que queiram evoluir para a área das tecnologias server-side.

22 22 O GUIA PRÁTICO DO DREAMWEAVER CS3 COM PHP, JAVASCRIPT E AJAX Embora seja recomendada alguma experiência ao nível do desenho de páginas Web, da utilização de linguagens de programação e da manipulação de bases de dados, o livro pretende ser acessível a qualquer pessoa que tenha interesse no desenvolvimento de sítios Web. Características principais do livro Neste livro todos os capítulos tentam ter uma componente prática, mesmo aqueles em que são apresentadas, de forma mais teórica, as tecnologias que vão ser utilizadas. Existem diversos projectos práticos, do tipo exercício guiado, em que o leitor pode reproduzir, passo-a-passo, a demonstração ou projecto a desenvolver. Todos os capítulos encontram-se profusamente ilustrados. Este aspecto é considerado fundamental de forma a melhor guiar o leitor na reprodução dos passos a efectuar em cada projecto. Os ficheiros dos exemplos práticos encontram-se disponíveis para os leitores. Veja na página 28 como pode ter acesso a esses ficheiros. Convenções usadas Este livro utiliza diversas convenções com vista a facilitar a assimilação da informação: Termos em inglês são apresentados, de uma forma geral, em itálico: " Utilizando as server behaviors, que são " "... não aparecerá nenhuma lista de pop-up." O código encontra-se formatado em Courier New: <?php require_once('connections/ligacao.php');?> <?php $maxrows_rsclientes = 10; $pagenum_rsclientes = 0; As alterações a serem efectuadas no código são assinaladas a negrito: mysql_select_db($database_ligacao, $ligacao); $query_rsclientes = "SELECT CódigoDoCliente, NomeDaEmpresa, País FROM clientes"; $query_limit_rsclientes = sprintf("%s LIMIT %d, %d", $query_rsclientes, $startrow_rsclientes, $maxrows_rsclientes); $rsclientes = mysql_query($query_limit_rsclientes, $ligacaobd) or die(mysql_error()); $row_rsclientes = mysql_fetch_assoc($rsclientes);

23 PREFÁCIO 23 O acesso a opções de menus ou de caixas de diálogo é formatado em letras maiúsculas pequenas. O carácter ">" é utilizado para separar o menu da opção: "... seleccionamos a opção INSERT > DATA OBJECTS > DYNAMIC DATA > DYNAMIC TABLE" Combinações de teclas são identificadas através do carácter "+". Por exemplo, CTRL+TAB significa pressionar a tecla "Control" e, mantendo esta tecla premida, de seguida premir a tecla Tab, soltando depois as duas teclas. Visão geral e Organização Este livro está organizado em vinte capítulos: Capítulo 1 Desenvolvimento de sites Web. Apresentação dos conceitos de páginas estáticas, interactivas e dinâmicas, e das tecnologias e metodologias utilizadas no desenvolvimento de páginas e sites Web. Capítulo 2 Definição de sites no Dreamweaver. Descreve a definição e gestão de sites no Dreamweaver CS3, a gestão de ficheiros e o trabalho em equipa. Capítulo 3 Trabalhar com código no Dreamweaver. Apresenta as funcionalidades existentes no Dreamweaver que facilitam o trabalho do Web Developer na produção de código JavaScript e PHP. Capítulo 4 A linguagem JavaScript. Introduz a linguagem JavaScript, apresentando a respectiva sintaxe, a utilização de variáveis, as estruturas de controlo do fluxo de programa, os operadores, as funções e o tratamento e depuração de erros. Aborda-se também a programação orientada para objectos e os diversos objectos internos do JavaScript. Capítulo 5 Document Object Model. Aborda o modelo de objectos utilizado pelo JavaScript para referenciar e manipular os elementos HTML existentes numa página Web. Fala-se também sobre a interacção entre o JavaScript e as CSS. Capítulo 6 Eventos. Enumera os eventos disponíveis numa página Web e a resposta que pode ser definida para esses eventos através de event handlers e de event listeners. Capítulo 7 JavaScript no Dreamweaver CS3. Neste capítulo são apresentadas as capacidades inatas do Dreamweaver para trabalhar com o JavaScript. Capítulo 8 Behaviors. Explica as behaviors JavaScript que estão disponíveis no Dreamweaver para a criação de páginas interactivas.

24 24 O GUIA PRÁTICO DO DREAMWEAVER CS3 COM PHP, JAVASCRIPT E AJAX Capítulo 9 Elementos de navegação. São apresentadas as behaviors JavaScript e os widgets Spry que permitem criar elementos de navegação, nomeadamente navigation bars, jump menus, pop-up menus e painéis. Capítulo 10 Trabalhar com formulários. Aborda a utilização de formulários em páginas Web relativamente à validação da informação introduzida pelo utilizador. São apresentados os widgets Spry Validation. Capítulo 11 Animação e timelines. Apresenta as possibilidades de animação de elementos HTML, nomeadamente elementos AP, por parte do JavaScript. Capítulo 12 Instalar o Apache, PHP e MySQL. Instalação e configuração do Apache, PHP e MySQL e abordagem dos pacotes integrados existentes no mercado. Capítulo 13 A linguagem PHP. Introduz a linguagem PHP, apresentando a respectiva sintaxe, a utilização de variáveis, as estruturas de controlo do fluxo de programa, os operadores e as funções. Aborda-se também a programação orientada para objectos e a interacção com ficheiros XML. Capítulo 14 Trabalhar com PHP no Dreamweaver. Neste capítulo são apresentadas as funcionalidades do Dreamweaver para trabalhar com o PHP, quer seja ao nível das server behaviors ou da utilização de código. Capítulo 15 Criar e utilizar bases de dados. Fornece os procedimentos necessários para criar e utilizar bases de dados, e apresenta as ferramentas que podem ser utilizadas para efectuar essas operações bem como para administrar, extrair e manipular dados em bases de dados MySQL. Capítulo 16 Aceder a dados de uma base de dados MySQL utilizando PHP. Introduz as server behaviors do Dreamweaver que permitem o acesso, por parte do PHP, a bases de dados MySQL, para a extracção e pesquisa de dados. Capítulo 17 Manipular dados. Apresenta as três operações inserção, alteração e eliminação utilizadas na manipulação de dados em bases de dados MySQL, recorrendo a páginas PHP. Capítulo 18 Autenticação de utilizadores. Aborda o problema dos acessos não autorizados a sítios Web, com a criação de uma infraestrutura de autenticação de utilizadores e de controlo de acessos a páginas Web.

25 PREFÁCIO 25 Capítulo 19 Utilização avançada do PHP. Partindo dos conceitos apresentados nos capítulos anteriores, faz uma exploração de áreas mais avançadas, nomeadamente a transferência (upload) de ficheiros, a utilização de imagens e o envio de mensagens de correio-electrónico. Capítulo 20 AJAX. Este capítulo introduz o AJAX, um conjunto de tecnologias que está a revolucionar o desenho de sites e que é muito utilizado pelos sites da Web 2.0. Aborda-se também o XML/XSLT e a interacção entre o AJAX e o PHP.

26 19 Utilização avançada do PHP Nos capítulos anteriores exploramos as operações básicas que são utilizadas num sítio Web dinâmico, como o acesso e manipulação de dados, bem como a autenticação de utilizadores. Podemos agora criar páginas mais complexas e explorar outras áreas do desenvolvimento de páginas com o PHP Upload de ficheiros e utilização de imagens Vamos ao site do Centro Atlântico ( buscar imagens para realizarmos um exemplo de upload (transferência para o servidor) de ficheiros e de utilização de imagens em páginas. Clicámos no lado esquerdo no link SOFTWARE OBRIGATÓRIO na área COLECÇÕES, e no início da página temos capas de livros:

27 592 O GUIA PRÁTICO DO DREAMWEAVER CS3 COM PHP, JAVASCRIPT E AJAX Com o botão do lado direito (e utilizando a opção SAVE PICTURE AS [GUARDAR IMAGEM COMO]) vamos guardar as oito capas de livros no nosso disco numa pasta dentro do site. Pode manter os nomes originais das imagens Criação das tabelas Agora acedemos ao MySQL Administrator para criar a tabela livros (na base de dados dados) que vai conter a informação sobre os livros: Utilizou-se um tipo de dados SMALLINT para a coluna numpaginas já que este tipo de dados possui um intervalo de valores de 0 a quando é utilizado UNSIGNED (isto é, sem sinal), o que é suficiente. O tipo de dados TINYINT não pode ser utilizado porque o intervalo de valores é 0 a 255, e um livro pode ter mais de 255 páginas. Quanto à coluna preco, utiliza-se o tipo de dados DECIMAL(5,2) que permite valores até 999,99, utilizando inteiros com até três algarismos além de 2 casas decimais (o primeiro valor, 5, corresponde ao número de algarismos utilizados). Caso pretendêssemos manter a lógica das colecções do Centro Atlântico, teríamos de introduzir um campo codcoleccao na tabela livros e criar uma tabela coleccoes com dois campos: codcoleccao e nomecoleccao. Utilizamos uma coluna auto-incrementável para o código do livro, mas também seria possível utilizar a coluna isbn como chave primária da tabela já que este valor é único para cada livro e portanto nunca se repete. Outra informação que poderíamos armazenar na tabela livros seria a data da edição do livro.

28 19. UTILIZAÇÃO AVANÇADA DO PHP 593 Poderá pensar que nos esquecemos de criar uma coluna para o autor do livro, mas como pode existir mais de um autor por livro, não é adequado criar esse tipo de coluna na tabela livros. Vamos então criar uma tabela autores que conterá o nome de cada autor do Centro Atlântico (embora possa ter mais informação): Para associar cada autor a um livro recorremos a outra tabela, livros_autores,

29 594 O GUIA PRÁTICO DO DREAMWEAVER CS3 COM PHP, JAVASCRIPT E AJAX que possui uma chave primária composta por duas colunas (clique no losango para transformar em chave a coluna codautor), cada uma das quais, individualmente, é chave primária nas tabelas livros e autores, respectivamente Criação da página autores.php Temos de criar duas páginas Web uma para inserir autores e outra para inserir os livros. Não vamos estar muito preocupados com a parte estética nem com detalhes, por isso a nossa página autores.php terá o seguinte aspecto: O campo utilizado chama-se nomeautor e possui um CHAR WITDTH e um MAX CHARS de 50, enquanto o formulário tem o nome forminsere. Adicionamos agora uma server behavior INSERT RECORD:

30 19. UTILIZAÇÃO AVANÇADA DO PHP 595 Dado que a coluna codautor da tabela autores é auto-incrementável, apenas utilizamos o campo nomeautor nesta server behavior Mensagem de sucesso Inserimos também o seguinte código, <td width="590" valign="top" class="celdir"><h2>registo de autores</h2> <?php if ((isset($_get['sucesso'])) && ($_GET['sucesso']=="sim")){?> <p align="left">autor inserido com sucesso.</p> <?php }?> <form action="<?php echo $editformaction;?>" method="post" name="forminsere" id="forminsere"> de forma a fornecer ao utilizador o feedback relativo à inserção do autor. Na server behavior INSERT RECORD tínhamos passado um parâmetro sucesso, com o valor sim Controlar valores repetidos Outra operação que temos de efectuar é evitar a introdução de nomes repetidos de autores. Vamos então recorrer à server behavior USER AUTHENTICATION > CHECK NEW USERNAME: Embora esta server behavior tenha sido desenhada para testar a existência de utilizadores quando estes se registam, também é possível utilizá-la em outras situações. Para que o utilizador seja informado do erro, vamos mais uma vez acrescentar código, <td width="590" valign="top" class="celdir"><h2>registo de autores</h2> <?php if ((isset($_get['sucesso'])) && ($_GET['sucesso']=="sim")){?> <p align="left">autor inserido com sucesso.</p> <?php } if (isset($_get['requsername'])) {

31 596 O GUIA PRÁTICO DO DREAMWEAVER CS3 COM PHP, JAVASCRIPT E AJAX?> <p align="left" class="mensagem">o autor '<?php echo $_GET['requsername'];?>' já existe na base de dados!</p> <?php }?> <form action="<?php echo $editformaction;?>" method="post" name="forminsere" id="forminsere"> de forma a produzir a seguinte mensagem de erro: Aproveitamo-nos assim do parâmetro de querystring requsername que a server behavior CHECK NEW USERNAME cria automaticamente sempre que o autor já exista na respectiva tabela. Não se esqueça de associar uma behavior VALIDATE FORM ao formulário forminsere para obrigar ao preenchimento do campo nomeautor. Poderá também efectuar uma validação idêntica no código PHP. Outra possibilidade é colocar o cursor automaticamente no campo nomeautor sempre que a página é invocada recorrendo mais uma vez a código Javascript (document.getelementbyid('nomeautor').focus();) no evento onload da etiqueta <body>. Introduzimos agora alguns autores dos livros da colecção Software Obrigatório:

32 19. UTILIZAÇÃO AVANÇADA DO PHP 597 O facto de podemos utilizar esta página para introduzir diversos autores faz com que sejam acrescentados sucessivamente vários parâmetros sucesso, o que poderá trazer alguns problemas caso façamos a inserção de muitos autores numa única sessão de trabalho: Além disso o parâmetro requsername também permanecerá na querystring caso se tenha enganado e tenha introduzido um autor repetido. Para evitar este comportamento remova, ou coloque em comentário (utilizando /* no início e */ no fim), o seguinte código: Ao fazer esta operação, a server behavior INSERT FORM deixará de aparecer no separador SERVER BEHAVIORS do painel APPLICATION e a server behavior CHECK NEW USERNAME aparecerá com um ponto de exclamação Criação da página livros.php Passemos agora à página livros.php que tem, para já, o seguinte aspecto: Atribua aos campos os mesmos nomes das colunas correspondentes da tabela livros. Os valores de CHAR WIDTH e MAX CHARS também devem ser idênticos aos tamanhos das colunas. O campo numpaginas deverá ter um

33 598 O GUIA PRÁTICO DO DREAMWEAVER CS3 COM PHP, JAVASCRIPT E AJAX tamanho de 4 caracteres (para permitir livros com páginas até 9999) e o campo preco um tamanho de 6 caracteres (para permitir preços até 999,99 ). Na área AUTORES colocamos um LIST/MENU de nome autores, seguido de um botão com o VALUE + e uma ACTION do tipo NONE, de um botão com o VALUE - e uma ACTION do tipo NONE, e finalmente um LIST/MENU do tipo MENU com uma altura de 3 linhas (atributo HEIGHT) e um TYPE LIST, com o nome autores_livro. O botão + vai permitir passar o autor seleccionado no campo autores para o campo autores_livro, enquanto o botão - remove da lista autores_ livro o autor seleccionado nessa lista. O campo CAPA é do tipo FILE FIELD Gestão dos autores do livro O campo autores é preenchido automaticamente com o conteúdo da tabela autores utilizando o seguinte recordset: Seleccione depois o LIST/MENU autores e clique no botão DYNAMIC no PROPERTY INSPECTOR, preenchendo a janela que aparece com os seguintes valores:

34 19. UTILIZAÇÃO AVANÇADA DO PHP 599 Repare que os valores (VALUES) no List/Menu vão ser os códigos dos autores, enquanto o texto que é apresentado (LABELS) corresponde aos nomes. Introduzimos uma opção estática com o valor 0 (dado que nunca existirá um código de autor com este valor) e o LABEL -- Seleccione um autor --. Para criar a funcionalidade dos botões + e - é necessário recorrer ao Javascript. Veja como fazê-lo no capítulo 10 - FORMULÁRIOS (mas exactamente em INTERACÇÃO ENTRE CAMPOS DE UM FORMULÁRIO). Outro campo especial do formulário existente na página livros.php é o campo capa que utiliza um campo do tipo FILE FIELD. O campo vai servir para o envio da imagem da capa do livro para o servidor Web, se bem que a imagem não vá ser armazenada na base de dados. Esta operação de transferência de ficheiros para o servidor tem o nome de upload. A introdução do campo do tipo FILE FIELD altera o atributo enctype do formulário para "multipart/ form-data", o que permite o envio de ficheiros para o servidor Validação dos dados inseridos no formulário Agora que já temos os campos criados e a funcionar correctamente, vamos utilizar uma behavior VALIDATE FORM para validar o preenchimento dos campos (não se esqueça de seleccionar em primeiro lugar o formulário no TAG SELECTOR):

35 600 O GUIA PRÁTICO DO DREAMWEAVER CS3 COM PHP, JAVASCRIPT E AJAX Active a checkbox REQUIRED para todos os campos e no caso dos campos numpaginas, preco e edicao também active a opção NUMBER para só permitir a introdução de algarismos. Mas esta behavior não permite validar o preenchimento dos campos autores_livro e capa, que também são obrigatórios, por isso vamos ter de a alterar. Localize o seguinte código, e insira o seguinte código entre a chaveta e o comando if (errors): if (document.getelementbyid("autores_livro").length==0) { errors += '- o campo "autores" é de preenchimento obrigatório.\n'; } if (document.getelementbyid('capa').value=="") { errors += '- o campo "capa" é de preenchimento obrigatório.'; } if (errors) alert('the following error(s) occurred:\n'+errors); document.mm_returnvalue = (errors == ''); } } </script> Claro está que pode aproveitar para mudar as outras mensagens de erro para português. Podia também ter recorrido a widgets SPRY VALIDATION (ver capítulo 10) para efectuar uma validação mais sofisticada Obter os autores de cada livro Tal como está a nossa página Web, para que se possa guardar os autores de cada livro na tabela livros_autores é necessário que o utilizador seleccione todos os autores na lista autores_livro para que eles possam ser lidos pelo PHP. Mas essa é uma operação que não é muito lógico que se tenha de pedir aos utilizadores. Para evitar isto, vamos acrescentar à nossa página um campo escondido (hidden field) de nome lista_autores na parte de baixo do formulário), </table> <input name="lista_autores" type="hidden" id="lista_autores" /> </form>

36