Olá pessoal,

Como havia prometido no artigo anterior (EXPLORANDO O CONTROLE DATALIST - Parte 02), venho com este artigo que é último, sobre o controle DataList.

Neste artigo vou mostar como listar de forma organizada, produtos que estão em um banco de dados, inclusive com suas respectivas imagens...

Confira na imagem o modelo final:

editora.gif

 

Vamos então ao código...

Chamei este arquivo de index.aspx

 

<%@ Page Language="C#" %>

<%@ Import Namespace="System.Data" %>

<%@ Import Namespace="System.Data.SqlClient" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

<script language="C#" runat="server">

    SqlConnection conectar;

    void Page_Load(Object sender, EventArgs e) {

      conectar = new SqlConnection(ConfigurationManager.ConnectionStrings["conexao"].ConnectionString);

 

        if (!Page.IsPostBack) {

            SqlDataAdapter cmd = new SqlDataAdapter("Select * From TLivros Order By titulo", conectar);

            DataSet ds = new DataSet();

            cmd.Fill(ds, "Titulos");

            DataListLivros.DataSource=ds.Tables["Titulos"].DefaultView;

            DataListLivros.DataBind();

        }

    }

 

  void DataListLivros_Select(Object sender, EventArgs e)

  {

        String IdTitulo = DataListLivros.DataKeys[DataListLivros.SelectedItem.ItemIndex].ToString();

        SqlDataAdapter cmd = new SqlDataAdapter("Select * From TLivros Where id = " + IdTitulo, conectar);

        DataSet ds = new DataSet();

        cmd.Fill(ds, "DetalhesTitulos");

        DataRowView rowview = ds.Tables["DetalhesTitulos"].DefaultView[0];

        imgDetalhes.Src = "imagens/" + rowview["imagem"];

        IdLivro.Text = "<b>ID: </b>" + rowview["id"].ToString() + "<br>";

        lblGenero.Text = "<b>Gênero: </b>" + rowview["genero"].ToString() + "<br>";

        lblValor.Text = "<b>Valor: </b> R$ " + rowview["valor"].ToString() + "<p>";

        lnkComprar.Text = "<img alt=Comprar este Livro border=0 src=imagens/comprar.gif >";

        lnkComprar.Visible = true;

        lnkComprar.NavigateUrl ="#" + rowview["id"].ToString();

        lblTitulo.Text = rowview["titulo"].ToString();

        imgDetalhes.Visible = true;

        lnkComprar.Attributes.Add("onclick", "alert(Direcione seu usuário para a página de " +

                                  "aquisição do livro:\\n" + rowview["titulo"].ToString() + ")");

    }

 

  void DataListLivros_ItemCommand(Object sender, DataListCommandEventArgs E)

  {

        String titulo = DataListLivros.DataKeys[E.Item.ItemIndex].ToString();

        String commando = E.CommandName;

       

      switch(commando) {

          case "Discutir" :

            ShowDiscutir(titulo);

            break;

          case "Avaliar" :

            ShowAvaliar(titulo);

            break;

        }

    }

 

  void ShowAvaliar(String titulo)

    {

        Message.InnerHtml = "<h5>Avaliações para o ID <font color=red>\"" + titulo + "\"</font></h5>";

        Message.InnerHtml += "Você pode imprimir as avaliações aqui...";

    }

 

  void ShowDiscutir(String titulo)

    {

      Message.InnerHtml = "<h5>Discuções para ID <font color=red>\"" + titulo + "\"</font></h5>";

        Message.InnerHtml += "Imprima as discuções sobre o livro aqui...";

    }

 

</script>

 

<html xmlns="http://www.w3.org/1999/xhtml" >

<head runat="server"> <title>Lista de Livros</title></head>

<body style="margin:0;">

<form id="Form1" runat="server">

  <!-- #include virtual="header.inc" -->

  <table width="100%">

    <tr> <td width="50%">

        <ASP:DataList

            id="DataListLivros"

            RepeatColumns="2"

            OnSelectedIndexChanged="DataListLivros_Select"

            OnItemCommand="DataListLivros_ItemCommand"

            DataKeyField="id" runat="server">

 

          <ItemTemplate>

            <table cellpadding=10 style="font: 10pt verdana">

              <tr>

                <td valign="top">

                  <img id="Img1"

                        alt="Imagem do Livro"

                        align="top"

                        width="25"

                        border="1"

                        src=<%# DataBinder.Eval(Container.DataItem, "imagem", "imagens/{0}") %> runat="server"/>

                </td>

                <td valign="top">

                  <b>Titulo: </b>

                  <asp:linkbutton

                        ID="Linkbutton1"

                        Text=<%# DataBinder.Eval(Container.DataItem, "titulo") %>

                        CommandName="Select"

                        style="color:darkred"

                        runat="server"/>

                  <br>

                  <b>Valor: </b><%# DataBinder.Eval(Container.DataItem, "valor", "R$ {0}") %>

                  <br>

                  <asp:linkbutton ID="Linkbutton2" Text="Discuções" CommandName="Discutir" style="color:darkred;font:8pt tahoma" runat="server"/>                  |

                  <asp:linkbutton ID="Linkbutton3" Text="Avaliar" CommandName="Avaliar" style="color:darkred;font:8pt tahoma" runat="server"/>

                </td>

              </tr>

            </table>

          </ItemTemplate>

        </ASP:DataList>

      </td>

      <td valign="top" style="padding-top:15" width="50%">

        <table cellpadding="5" width="100%" style="font: 10pt verdana">

          <tr>

            <td style="height: 60px; width: 80px;">

              <img alt="book image" id="imgDetalhes" visible="false" runat="server" height="90" width="70">

            </td>

            <td valign="top" width="400" style="height: 60px">

              <div style="font: 12pt verdana;color:darkred">

                <i><b><asp:Label id="lblTitulo" runat="server"/></b></i><br>

              </div>

              <asp:Label id="IdLivro" runat="server"/><asp:Label id="lblGenero" runat="server"/><asp:Label id="lblValor" runat="server"/><asp:HyperLink id="lnkComprar" runat="server" Visible="False">[lnkComprar]</asp:HyperLink>

            </td>

          </tr>

        </table>

      </td>

    </tr>

  </table>

  <!-- #include virtual="footer.inc" -->

  <div id="Message" style="font: 10pt verdana;padding:0,15,15,15" runat="server"/>

  </form>

</body>

</html>

-----------------------------------------------------------------------------------------

Arquivo header.inc

  <table width=100% cellspacing=0 cellpadding=0>

    <tr>

      <td style="height:20" bgcolor="#993300" cellspacing=0 cellpadding=0 width=100%/>

    </tr>

    <tr>

      <td align="right" style="height:70;font-family:Arial;font-weight:bold;font-size:44pt;color:white" width="100%" bgcolor="#993300">

              <font size=6 color="#FFFFFF">Editora DataList On-line</font>

      </td>

    </tr>

  </table>

 

------------------------------------------------------------------------------------------

Arquivo footer.inc

  <table width=100% cellspacing=0 cellpadding=0>

    <tr>

      <td style="height:20" bgcolor="#993300" cellspacing=0 cellpadding=0 width=100%></td>

    </tr>

  </table>

 

Em anexo você encotra o aplicativo de exemplo com o um backup e um arquivo de script para gerar Banco original deste exemplo. Use um ou outro, de preferência o backup!

Bem galera, vou me despedindo e desejando a todos um excelente estudo!!!

Um abraço e até breve!!!