none
Consulta ao BD e imagem na Pasta de Arquivo, como fazer?

    Question

  • Olá!

     

    Estou com a seguinte dúvida: tenho uma consulta para um site que retorna os nomes dos produtos do BD dependendo do que foi digitado em um 'textBox'. Porém, gostaria de mostrar para o usuário uma imagem desse produto (essas imagens estão em uma 'Pasta de Arquivos' e não no BD).

     

    Na tabela dos Produtos consta um código que corresponde a imagem e o nome do arquivo dessa imagem ( que está na 'Pasta de Arquivos") é o mesmo que o código na tbl.

     

    Gostaria de saber qual o comando usar para 'chamar' essa imagem de acordo com a pesquisa feita?

     

    Alguém poderia me ajudar?

     

     

     

     

    Monday, November 03, 2008 8:52 PM

Answers

  • Olá Juliana,

     

    Em primeiro lugar, é importante que as imagens estejam em um diretório virtual que seja possível de ser acessado via browser, para que você possa referenciar as imagens. De preferência, elas deveriam estar em um subdiretório da sua aplicação Web.

     

    Se você precisa saber o conteúdo do campo Cd_material para descobrir o nome da imagem, então, o seu SELECT precisa incluir esse campo:

     

    "SELECT Descricao, Codigo_fabrica, Cd_material from PRODUTOS ..."

     

    Em seguida, para mostrar a imagem, você pode adicionar um controle Image do ASP .NET, dentro do ItemTemplate do seu DataList. Algo como:

     

    Code Snippet

     

     <asp:DataList ID="SeuDataList" runat="server">

    <ItemTemplate>

    <asp:Image ID="ImagemProduto" runat="server" />

    </ItemTemplate>

     </asp:DataList>

     

     

    O controle Imagem declarado em cada item do DataList, servirá para você, dinamicamente, mostrar a imagem de acordo com o caminho você irá determinar através do campo Cd_material.

     

    Para finalizar, basta você programar o evento OnItemCreated do seu DataList, para montar o caminho da imagem, e mostrar no controle.

     

    No ASPX você associa ao método que você quer executar cada vez que um novo item for criado no DataList.

     

    Code Snippet

     

     <asp:DataList ID="SeuDataList" ... OnItemCreated="seuDataList_ItemCreated">

       ...

     </asp:DataList>

     

     

    E no code-behind, você implementa algo assim:

     

    Code Snippet

     

     protected void DataList1_ItemCreated(object sender, DataListItemEventArgs e)

     {

    // Obtém a linha atual que está sendo criada no DataList

    DataRowView linha = e.Item.DataItem as DataRowView;

     

    // Obtém o código do material que está nessa linha

    int codigoImagem = Convert.ToInt32(linha["Cd_material"]);

     

    // Monta o caminho da imagem

    string caminhoImagem = string.Format("~/Imagens/Produtos/{0}.jpg", codigoImagem);

     

    // Obtém uma referência para a imagem que está na linha do DataList

    Image imagem = e.Item.FindControl("ImagemProduto") as Image;

     

    // Define o caminho da imagem e mostra para o usuário

    imagem.ImageUrl = caminhoImagem;

     }

     

     

    Abraços,
    Caio Proiete




    Caio Proiete
    http://www.caioproiete.com
    Tuesday, November 04, 2008 4:24 PM
    Moderator
  • Olá Juliana,

     

    Isso acontece porque o FindControl não está conseguindo encontrar o seu controle Imagem.

     

    Veja só, lá no seu ItemTemplate (no ASPX), você adicionou um controle do tipo Image, e deu um ID para esse controle:

     

    Code Snippet

     

     <asp:Image ID="ImagemProduto" runat="server" />

     

     

     

     

    Lá no código, você procura pelo controle utilizando esse mesmo ID. Assim, se o FindControl procura por um controle chamado ImagemProduto, esse deve ser o ID do controle lá dentro do seu ItemTemplate Wink

     

    Code Snippet

     

     protected void DataList1_ItemCreated(object sender, DataListItemEventArgs e)

     {

    // ...

     

    // Obtém uma referência para a imagem que está na linha do DataList

    Image imagem = e.Item.FindControl("ImagemProduto") as Image;

     

    // Define o caminho da imagem e mostra para o usuário

    imagem.ImageUrl = caminhoImagem;

     }

     

     

    Abraços,
    Caio Proiete



     


    Caio Proiete
    http://www.caioproiete.com

    Tuesday, November 04, 2008 5:52 PM
    Moderator
  •  Juliana KR wrote:

    Ah, sem querer abusar, as imagens ficaram grandes para a página. Como eu posso colocar um padrao de tamanho menor?

     

    Olá Juliana,

     

    Se você precisa das imagens em tamanho menor, o redimensioná-las, para deixar a aplicação mais leve. De qualquer forma, você pode definir diretamente a largura (Width) e altura (Height) da imagem no controle Image:

     

    Code Snippet

     

     protected void seuDataList_ItemCreated(object sender, DataListItemEventArgs e)

     {

    // ...

     

    // Para definir que a imagem dever  ficar em 300x300 pixels

    imagem.Width = Unit.Pixel(300);

    imagem.Height = Unit.Pixel(300);

     

    // Ou ainda, para definir que a imagem dever  ficar em 50%x50%

    imagem.Width = Unit.Percentage(50);

    imagem.Height = Unit.Percentage(50);

     }

     

     

    Você pode ainda, definir uma classe CSS em um arquivo separado (ou mesmo no seu ASPX), e definir que a imagem utiliza a classe CSS que você definiu:

     

    Code Snippet

     

     protected void seuDataList_ItemCreated(object sender, DataListItemEventArgs e)

     {

    // ...

     

    imagem.CssClass = "imagemDoProduto";

     }

     

    Abraços,
    Caio Proiete




    Caio Proiete
    http://www.caioproiete.com
    Tuesday, November 04, 2008 9:42 PM
    Moderator

All replies

  • Olá Juliana,

     

    Assumindo que as imagens estão em um diretório virtual dentro do seu site, tudo o que você precisa fazer, é consultar o produto na base de dados, "montar" o caminho da imagem em uma string e definir o caminho no controle...

     

    Qual é exatamente a sua dúvida?

     

    Abraços,
    Caio Proiete




    Caio Proiete
    http://www.caioproiete.com
    Monday, November 03, 2008 9:30 PM
    Moderator
  • Olá Caio!

    Na verdade as imagens estão em uma pasta na rede da loja. Meu chefe tem um sistema ERP onde cadastra produtos dentro de um BD e as imagens desses produtos vão para uma pasta.

     

    A minha dúvida é em como faço para fazer a consulta de produtos "puxando" a imagem respectiva.

    Minha consulta está assim:

    string selequip = "select Descricao, Codigo_fabrica from PRODUTOS where Descricao like '%" + lbldesc.Text + "%' ";

     

    Como fica esse select? Tem que ter mais de um?

     

    E nessa tabela tem um campo "Cd_material" que é igual ao "nome" da imagem na pasta (por ex: Cd_material = 000007, imagem = 7.jpg). Dependendo do resultado da consulta retornará uma imagem. Não sei se faz diferença, mas estou mostrando os dados com um datalist. 

     

    É meio difícil de explicar...

     

    Obrigada pela atenção!

     

     

    Tuesday, November 04, 2008 3:31 PM
  • Olá Juliana,

     

    Em primeiro lugar, é importante que as imagens estejam em um diretório virtual que seja possível de ser acessado via browser, para que você possa referenciar as imagens. De preferência, elas deveriam estar em um subdiretório da sua aplicação Web.

     

    Se você precisa saber o conteúdo do campo Cd_material para descobrir o nome da imagem, então, o seu SELECT precisa incluir esse campo:

     

    "SELECT Descricao, Codigo_fabrica, Cd_material from PRODUTOS ..."

     

    Em seguida, para mostrar a imagem, você pode adicionar um controle Image do ASP .NET, dentro do ItemTemplate do seu DataList. Algo como:

     

    Code Snippet

     

     <asp:DataList ID="SeuDataList" runat="server">

    <ItemTemplate>

    <asp:Image ID="ImagemProduto" runat="server" />

    </ItemTemplate>

     </asp:DataList>

     

     

    O controle Imagem declarado em cada item do DataList, servirá para você, dinamicamente, mostrar a imagem de acordo com o caminho você irá determinar através do campo Cd_material.

     

    Para finalizar, basta você programar o evento OnItemCreated do seu DataList, para montar o caminho da imagem, e mostrar no controle.

     

    No ASPX você associa ao método que você quer executar cada vez que um novo item for criado no DataList.

     

    Code Snippet

     

     <asp:DataList ID="SeuDataList" ... OnItemCreated="seuDataList_ItemCreated">

       ...

     </asp:DataList>

     

     

    E no code-behind, você implementa algo assim:

     

    Code Snippet

     

     protected void DataList1_ItemCreated(object sender, DataListItemEventArgs e)

     {

    // Obtém a linha atual que está sendo criada no DataList

    DataRowView linha = e.Item.DataItem as DataRowView;

     

    // Obtém o código do material que está nessa linha

    int codigoImagem = Convert.ToInt32(linha["Cd_material"]);

     

    // Monta o caminho da imagem

    string caminhoImagem = string.Format("~/Imagens/Produtos/{0}.jpg", codigoImagem);

     

    // Obtém uma referência para a imagem que está na linha do DataList

    Image imagem = e.Item.FindControl("ImagemProduto") as Image;

     

    // Define o caminho da imagem e mostra para o usuário

    imagem.ImageUrl = caminhoImagem;

     }

     

     

    Abraços,
    Caio Proiete




    Caio Proiete
    http://www.caioproiete.com
    Tuesday, November 04, 2008 4:24 PM
    Moderator
  • Olá Caio!

    Muitíssimo obrigada pelo código, mas está acontecendo duas situações quando coloco o OnItemCreated="seuDataList_ItemCreated".  Ah, fiz uma cópia da pasta das imagens e coloquei em um subdiretório da minha aplicação web.

    1º Se não colocar a consulta aparece normal, porém no local da imagem aparece um X.

    2º Se colocar aparece o seguinte erro:  

    Erro de Servidor no Aplicativo '/WebDesign - Cópia'.

    Referência de objeto não definida para uma instância de um objeto.

    Descrição: Ocorreu uma exceção não tratada durante a execução da atual solicitação da Web. Examine o rastreamento de pilha para obter mais informações sobre o erro e onde foi originado no código.

    Detalhes da Exceção: System.NullReferenceException: Referência de objeto não definida para uma instância de um objeto.

    Erro de Origem:

    Linha 90:         // Define o caminho da imagem e mostra para o usuário
    Linha 91: 
    Linha 92:         imagem.ImageUrl = caminhoImagem;
    Linha 93: 
    Linha 94:     }

     

     

    Valeu!!!

    Tuesday, November 04, 2008 5:31 PM
  • Olá Juliana,

     

    Isso acontece porque o FindControl não está conseguindo encontrar o seu controle Imagem.

     

    Veja só, lá no seu ItemTemplate (no ASPX), você adicionou um controle do tipo Image, e deu um ID para esse controle:

     

    Code Snippet

     

     <asp:Image ID="ImagemProduto" runat="server" />

     

     

     

     

    Lá no código, você procura pelo controle utilizando esse mesmo ID. Assim, se o FindControl procura por um controle chamado ImagemProduto, esse deve ser o ID do controle lá dentro do seu ItemTemplate Wink

     

    Code Snippet

     

     protected void DataList1_ItemCreated(object sender, DataListItemEventArgs e)

     {

    // ...

     

    // Obtém uma referência para a imagem que está na linha do DataList

    Image imagem = e.Item.FindControl("ImagemProduto") as Image;

     

    // Define o caminho da imagem e mostra para o usuário

    imagem.ImageUrl = caminhoImagem;

     }

     

     

    Abraços,
    Caio Proiete



     


    Caio Proiete
    http://www.caioproiete.com

    Tuesday, November 04, 2008 5:52 PM
    Moderator
  • Caio, tu é um anjo que caiu do céu! Funcionou perfeitamente!

     

    Ah, sem querer abusar, as imagens ficaram grandes para a página. Como eu posso colocar um padrao de tamanho menor?

     

    Muuuuuito Obrigada!

     

    []'s

     

     

    Tuesday, November 04, 2008 6:13 PM
  • Olá (de novo, hehe)!

    Testando o programa descobri que ao tentar a segunda consulta consecutiva apareceu a seguinte mensagem:

    (Editando: Esqueci de mencionar que o textbox e o button estão na MasterPage, não sei se faz diferença).

    Erro de Servidor no Aplicativo '/WebDesign - Cópia'.

    Referência de objeto não definida para uma instância de um objeto.

    Descrição: Ocorreu uma exceção não tratada durante a execução da atual solicitação da Web. Examine o rastreamento de pilha para obter mais informações sobre o erro e onde foi originado no código.

    Detalhes da Exceção: System.NullReferenceException: Referência de objeto não definida para uma instância de um objeto.

    Erro de Origem:

    Linha 79:             // Obtém o código do material que está nessa linha
    Linha 80: 
    Linha 81:             int codigoImagem = Convert.ToInt32(linha["Cd_material"]);
    Linha 82: 
    Linha 83:             // Monta o caminho da imagem
    Tuesday, November 04, 2008 6:36 PM
  •  Juliana KR wrote:

    Ah, sem querer abusar, as imagens ficaram grandes para a página. Como eu posso colocar um padrao de tamanho menor?

     

    Olá Juliana,

     

    Se você precisa das imagens em tamanho menor, o redimensioná-las, para deixar a aplicação mais leve. De qualquer forma, você pode definir diretamente a largura (Width) e altura (Height) da imagem no controle Image:

     

    Code Snippet

     

     protected void seuDataList_ItemCreated(object sender, DataListItemEventArgs e)

     {

    // ...

     

    // Para definir que a imagem dever  ficar em 300x300 pixels

    imagem.Width = Unit.Pixel(300);

    imagem.Height = Unit.Pixel(300);

     

    // Ou ainda, para definir que a imagem dever  ficar em 50%x50%

    imagem.Width = Unit.Percentage(50);

    imagem.Height = Unit.Percentage(50);

     }

     

     

    Você pode ainda, definir uma classe CSS em um arquivo separado (ou mesmo no seu ASPX), e definir que a imagem utiliza a classe CSS que você definiu:

     

    Code Snippet

     

     protected void seuDataList_ItemCreated(object sender, DataListItemEventArgs e)

     {

    // ...

     

    imagem.CssClass = "imagemDoProduto";

     }

     

    Abraços,
    Caio Proiete




    Caio Proiete
    http://www.caioproiete.com
    Tuesday, November 04, 2008 9:42 PM
    Moderator
  •  Juliana KR wrote:

    Olá (de novo, hehe)!

    Testando o programa descobri que ao tentar a segunda consulta consecutiva apareceu a seguinte mensagem:

    (Editando: Esqueci de mencionar que o textbox e o button estão na MasterPage, não sei se faz diferença).


    Erro de Origem:

    Linha 79:             // Obtém o código do material que está nessa linha
    Linha 80: 
    Linha 81:             int codigoImagem = Convert.ToInt32(linha["Cd_material"]);
    Linha 82: 
    Linha 83:             // Monta o caminho da imagem

     

    Olá Juliana,

     

    Parece que ele não está conseguindo obter a referência para a linha do registro na linha:

     

    Code Snippet

     

     // Obtém a linha atual que está sendo criada no DataList

     DataRowView linha = e.Item.DataItem as DataRowView;

     

     

    Você está fazendo o DataBind corretamente na segunda consulta?

     

    Abraços,
    Caio Proiete




    Caio Proiete
    http://www.caioproiete.com
    Tuesday, November 04, 2008 9:47 PM
    Moderator
  • Oi Caio!

    O programa não está retornando para a nova consulta, será que é porque o button está na MasterPage e o programa roda no Default.aspx?  

    Terei que modificar algo na MasterPage?

     

    Aqui vai meu código de consulta:

     

    protected void Page_Load(object sender, EventArgs e)

    {

    if (Page.Master != null)

    {

    if (Page.Master.Page.IsPostBack)

    {

    lblresult.Text = ((Informtec)Page.Master).TextoBusca;

    }

    }

    SqlConnection concigam = new SqlConnection(strconcigam);

    if (IsPostBack)

    {

     

    string selequip = "select Descricao, Codigo_fabrica, Cd_material from PRODUTOS where Descricao like '%"+lblresult.Text+"%' ";

    SqlDataAdapter da = new SqlDataAdapter(selequip, strconcigam);

    DataTable dt = new DataTable();

     

    try

    {

    da.Fill(dt);

    rpLink.DataSource = dt;

    rpLink.DataBind();

    Session["Table"] = dt;

    }

    catch (SqlException ex)

    {

    Response.Write("<script language='javascript'>alert('" + ex.Message + "');</script>");

    }

    concigam.Close();

    }

    }

     

    []'s

    Wednesday, November 05, 2008 3:18 PM