Exemplo 2

20. Neste exemplo, vamos imaginar uma página de uma locadora virtual, onde o internauta possa ler a sinopse de um filme ou até mesmo ver um trailer, antes de fazer a locação. Em uma locadora convencional o cliente pega a embalagem das fitas dos filmes e nela olha a sinopse do filme, para tornar a nossa página mais eficiente, vamos colocar as fotos destas embalagens para que o nosso cliente virtual não sinta falta de nada. Para uma melhor organização dentro do nosso site vamos colocar estas estas fotos dentro de uma pastas. Então dentro da pasta locaweb dê um duplo click em Add Folder, como mostra a figura abaixo :

21. Na janela New Folder Name, coloque o nome da nossa nova pasta : figuras, em seguida clique no botão avançar :

22. O próximo passo é : clique com o botão direito do mouse em cima da nova pasta figuras, em seguida clique em Import .

23. Esta opção é utilizada para importar para dentro do banco de dados (site), qualquer arquivo. Utilize o botão File Borwse para ter acesso aos arquivos que você deseja importar.

24. Selecione os arquivos que deseja importar e clique no botão OK. Deverá aparecer me Import Files a relação de arquivos a serem importados, como mostra a figura abaixo. Após conferir clique no botão OK.

25. Quando terminas a importação dos arquivos para dentro do banco de dados (site), ao clicar na pasta figuras você poderá conferir se todos os arquivos necessários, foram importados.

26. É possível ver no browser, em qualquer computador da rede, as figuras importadas. Basta digitar o endereço correspondente. Veja um exemplo na figura abaixo :

27. Para a implementação deste exemplo, criei uma tabela chamada filmes, dentro do mesmo banco de dados onde está este site. É nesta tabela que nós vamos buscar as informações necessárias para montar as páginas que serão consultadas pelos internaltas.
Vamos criar uma nova página, repetindo o procedimento 13 e 14, dê um duplo clique em Add Template e na janela new Template Name coloque o nome desta nova página : pagina2 , em seguida clique no botão avançar, como mostra a figura abaixo :

28. Na janela Template Description, coloque uma descrição para a nova página. Por exemplo : Consulta Filmes, em seguida clique no botão avançar.

29. Na janela New Template Default Connection, utilize < inherited > . Isto permitirá o acesso as tabelas do banco de dados sem a preocupação de criação de novas conexões.

30. Na janela Add SQL Query to New Template, clique no botão Select para que você possa elaboras a instrução SQL com ajuda do Edit SQL Query..

31. Na janela Edit SQL Query, em Tables selecione as tabelas onde estão armazenadas as informações que desea mostrar. Para isso, clique na tabela em Matching Tables em seguida clique no botão Add>> .

32. Veja na figura abaixo,  a tabela selecionada deverá aparecer em Selected Tables.

33. Agora em Columns repita o procedimento, selecionando as colunas da tabela em Available Columns em seguida clique no botão Add>>. As colunas selecionadas deverão aparecer em Selected Columns. Vários outros itens podem ser definidos utilizando Joins, Sort, Where, Goup, Having e Compute.

34. Em Test , é possível ver a instrução SQL em SQL Statement. Também é possível testar a instrução SQL clicando no botão Test, o resultado aparecerá na parte inferior da janela como mostra a seta da figura abaixo :

35.  Na janela Add SQL Query to New Template temos a instrução SQL resultante dos passos 30 a 33. Clique no botão Avançar.

36. Na janela Document Type, você seleciona o tipo de documento que está sendo criado. Escolha HTML e clique no botão avançar.

37. Em New Template Initial HTML, selecione Table with headings e clique no botão concluir.

38. Para ver o resultado deste novo exemplo, mais uma vez utilize o browser, colocando o endereço correspondente, como mostra a figura abaixo.

39. Vamos fazer algumas mudanças neste exemplo, para isso dê um duplo click em pagina2.stm .

40. Na coluna foto da tabela filmes temos a url do gif que está dentro do banco de dados. Basta uma pequena alteração no código html para que apareça a foto. A alteração deve ser feita como mostra a seta da figura abaixo. Em seguida para salvar as alterações clique no botão Save to Database marcado com um círculo na figura abaixo.

41. Basta agora voltar ao browser e acessar novamente a página. Na coluna foto aparecerá o gif correspondente.