Neste tutorial vamos ver como criar um catálogo simples com bancos
de dados e fotos. O catálogo será de livros, com as respectivas imagens das
capas. Segue o passo a passo:
1. Primeiro crie uma tabela no MySQL com o seguinte código:
CREATE TABLE `livros` (
`id` int(10)
unsigned NOT NULL auto_increment,
`categoria`
varchar(50) default NULL,
`titulo`
varchar(200) default NULL,
`autor`
varchar(100) default NULL,
`paginas`
tinyint(3) unsigned default NULL,
`ano` char(4)
default NULL,
`preco`
decimal(8,2) unsigned default NULL,
`resumo` text,
`capa`
varchar(50) default NULL,
PRIMARY
KEY (`id`),
UNIQUE KEY
`id` (`id`),
KEY `id_2`
(`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1
Na coluna “capa” cadastre o nome da imagem de cada capa.
2. O segundo passo é criar em seu computador uma pasta para
as imagens (v. exemplo abaixo):
3. Cadastre alguns livros na tabela e vamos criar uma primeira página simples, apenas
com os títulos dos livros e as categorias:
<%@LANGUAGE="VBSCRIPT"
CODEPAGE="1252"%>
<html
xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1" />
<title>Catalogo simples com MySQL</title>
<style type="text/css">
<!--
a:link {
text-decoration:
none;
}
a:visited {
text-decoration:
none;
}
a:hover {
text-decoration:
none;
}
a:active {
text-decoration:
none;
}
-->
</style></head>
<body>
Catalogo simples com MySQL - clique no titulo de um livro
para ver detalhes <br />
<br />
<table width="346"
border="1">
<tr>
<td><div align="center"><strong>
Categoria</strong></div></td>
<td
width="178"><div
align="center"><strong>Titulo</strong></div></td>
</tr>
</table>
<%
dim conexmy,Recordset1
set conexmy =
Server.CreateObject("ADODB.Connection")
conexmy.Open
"Driver={MySQL ODBC 5.1 Driver};SERVER=localhost;DATABASE=XXX;USER=XXX;PASSWORD=XXX;"
Set Recordset1 = conexmy.execute("select * from
livros")
while not Recordset1.EOF%>
<br />
<%=Recordset1.Fields("id")%> -
<%=Recordset1.Fields("categoria")%> -
<a
href='detalhes_livros.asp?id=<%=Recordset1.Fields("id")%>'><%=Recordset1.Fields("titulo")%></a>
<%
Recordset1.MoveNext
wend
%>
</p>
</body>
</html>
<%
Recordset1.Close()
Set Recordset1 = Nothing
%>
5. Substitua os três
“XXX” acima pelos seus dados. Importante:
neste tutorial, estamos usando uma conexão MyODBC ao Mysql. Para isso, vc
precisa ter o “driver” MyODBC instalado. Caso não saiba como fazer isso, há
varias dicas aqui: Instalar driver MyODBC.
6. Repare que cada título é um “link” para outra página com
os detalhes de um livro selecionado que será criada adiante. Salve e teste no
navegador, mas sem acionar os “links” ainda; o importante, por enquanto, é que
o “id” seja exibido corretamente; veja, no exemplo, passando-se o mouse sobre o
titulo do livro nº 6:
<img
src="XXX/<%=(Recordset1.Fields.Item("capa").Value)%>">
<%@LANGUAGE="VBSCRIPT"%>
<%
dim
conexmy,Recordset1,vid
set
conexmy = Server.CreateObject("ADODB.Connection")
conexmy.Open "Driver={MySQL ODBC 5.1
Driver};SERVER=localhost;DATABASE=XXX;USER=XXX;PASSWORD=XXX;"
vid=Request.QueryString("id")
Set
Recordset1 = conexmy.execute("SELECT * FROM livros WHERE id = " &
vid)
%>
<html
xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta
http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
<title>detalhes
- livros</title>
</head>
<body>
<table
width="654" border="1">
<tr>
<td width="169"><img src=XXX/<%=(Recordset1.Fields.Item(“capa").Value)%>"></td>
<td
width="469">
<%=(Recordset1.Fields.Item("id").Value)%>
-
<%=(Recordset1.Fields.Item("categoria").Value)%>
-
<%=(Recordset1.Fields.Item("titulo").Value)%>
<br />
<%=(Recordset1.Fields.Item("autor").Value)%><br
/><br />
<%=(Recordset1.Fields.Item("paginas").Value)%>
páginas -
Ano:
<%=(Recordset1.Fields.Item("ano").Value)%><br />
<%=
FormatCurrency((Recordset1.Fields.Item("preco").Value), -1, -2, -2,
-2) %><br /><br />
<%=(Recordset1.Fields.Item("resumo").Value)%>
</td>
</tr>
</table>
<p> </p>
</body>
</html>
<%
Recordset1.Close()
Set
Recordset1 = Nothing
%>