User Name Password Register
DaniWeb IT Discussion Community
Home
Forums
Tutorials
Code Snippets
Blogs
Link Directory
All
•
•
•
•
What is DaniWeb IT Discussion Community?
You're currently browsing the ASP.NET section within the Web Development category of DaniWeb, a massive community of 427,100 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 2,226 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Join our community!
Please support our ASP.NET advertiser: Lunarpages ASP Web Hosting
Views: 1569 | Replies: 13
Reply
Page 1 of 2 1 2 >
•
•
Join Date: May 2008
Posts: 12
Reputation: Techbee is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 0
Techbee Techbee is offline Offline
Newbie Poster

DataGrid View

  #1  
May 27th, 2008
Hi All

I am working on an e-commerce site using VB.Net and currently stuck on trying to display my products on the storefront. I am using a GridView control to present records of products from an access database.
The GridView is showing the records as they are in the Database but I need it to show images of the products. My Database contains the products table and the Images table and are linked with relationships.
I have put the ImageFiled control in the GridView but no images are coming up.

Could please help me as to how I can load the images into the Gridview corresponding with the item details. Or is there another contol I can use instead of the GridView.

Thanks
Guys
AddThis Social Bookmark Button
Reply With Quote  
•
•
Join Date: Dec 2007
Posts: 287
Reputation: ericstenson is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 28
Colleague
ericstenson's Avatar
ericstenson ericstenson is offline Offline
Posting Whiz in Training

Re: DataGrid View

  #2  
May 27th, 2008
Hey- Make it easy on yourself and easier on your database. Store the imagepath instead.
--
"Dummy."
Reply With Quote  
•
•
Join Date: May 2008
Posts: 12
Reputation: Techbee is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 0
Techbee Techbee is offline Offline
Newbie Poster

Re: DataGrid View

  #3  
May 27th, 2008
•
•
•
•
Originally Posted by ericstenson View Post
Hey- Make it easy on yourself and easier on your database. Store the imagepath instead.


Hi ericstenson

I have stored the imagepath in my Database, but how do I reference this path in my Code so that the image can be passed to the Datagrid.

Regards
Reply With Quote  
•
•
Join Date: May 2008
Posts: 34
Reputation: sebastian3 is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 1
sebastian3 sebastian3 is offline Offline
Light Poster

Re: DataGrid View

  #4  
May 28th, 2008
For storing Image try this :

Help with Code Tags 
 //UPLOAD FILE                   
                if (this.flBSmallImage.PostedFile.ContentLength > 0)
                {
                    if (strOldBSmallImage.Length > 0)
                    {
                        System.IO.File.Delete(Server.MapPath("../") + "UploadedFiles\\ManagementImage\\" + strOldBSmallImage.ToString());
                    }
                    String strPath = Server.MapPath("../") + "UploadedFiles/ManagementImage";
                    flBSmallImage.PostedFile.SaveAs(strPath + "/" + strBSmallImage);
                }


For viewing the Image, bind the Datgrid in backend and in aspx it should be :

Help with Code Tags 
   <ItemTemplate>
                                            <asp:Image ID="Image1" ImageUrl='<%# "../UploadedFiles/TemplateImage/" + ((clsTemplateImage)Container.DataItem).upload_image_name%>'
                                            height="71" width="171" AlternateText="" runat="server"/>
                                        </ItemTemplate>
Reply With Quote  
•
•
Join Date: May 2008
Posts: 12
Reputation: Techbee is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 0
Techbee Techbee is offline Offline
Newbie Poster

Re: DataGrid View

  #5  
May 28th, 2008
•
•
•
•
Originally Posted by sebastian3 View Post
For storing Image try this :

Help with Code Tags 
 //UPLOAD FILE                   
                if (this.flBSmallImage.PostedFile.ContentLength > 0)
                {
                    if (strOldBSmallImage.Length > 0)
                    {
                        System.IO.File.Delete(Server.MapPath("../") + "UploadedFiles\\ManagementImage\\" + strOldBSmallImage.ToString());
                    }
                    String strPath = Server.MapPath("../") + "UploadedFiles/ManagementImage";
                    flBSmallImage.PostedFile.SaveAs(strPath + "/" + strBSmallImage);
                }


For viewing the Image, bind the Datgrid in backend and in aspx it should be :

Help with Code Tags 
   <ItemTemplate>
                                            <asp:Image ID="Image1" ImageUrl='<%# "../UploadedFiles/TemplateImage/" + ((clsTemplateImage)Container.DataItem).upload_image_name%>'
                                            height="71" width="171" AlternateText="" runat="server"/>
                                        </ItemTemplate>


Thank you very much I'll get cracking on it, and will let you know the outcome.

Thanks
Reply With Quote  
•
•
Join Date: May 2008
Posts: 12
Reputation: Techbee is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 0
Techbee Techbee is offline Offline
Newbie Poster

Re: DataGrid View

  #6  
May 29th, 2008
Thanks Sebastian I managed upload and store the image in the Access Database but I have failed to assign the Imagefield to pick the Image using the URL and place it into the Gridview control.

My Gridview control has the following code:
Help with Code Tags
ASP.NET Syntax (Toggle Plain Text) 
  1. <asp:AccessDataSource ID="AccessDataSource1" runat="server" DataFile="~/database/myDatabase.mdb"
  2.                 SelectCommand="SELECT [ProductID], [Product_Name], [Product_Price], [Product_Description] FROM [Products]">
  3.             </asp:AccessDataSource>
  4.         </strong>
  5.  
  6.     </div>
  7.         <asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False"
  8.             CellPadding="4" DataKeyNames="ProductID" DataSourceID="AccessDataSource1" ForeColor="#333333"
  9.             GridLines="None">
  10.             <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
  11.             <Columns>
  12.                 <asp:BoundField DataField="ProductID" HeaderText="ProductID" InsertVisible="False"
  13.                     ReadOnly="True" SortExpression="ProductID" />
  14.                 <asp:BoundField DataField="Product_Name" HeaderText="Product_Name" SortExpression="Product_Name" />
  15.                 <asp:BoundField DataField="Product_Price" HeaderText="Product_Price" SortExpression="Product_Price" />
  16.                 <asp:BoundField DataField="Product_Description" HeaderText="Product_Description"
  17.                     SortExpression="Product_Description" />
  18.                 <asp:ImageField DataImageUrlField="ProductID" HeaderText="Image">
  19.                                 </asp:ImageField>
  20.                 <asp:ButtonField Text="Buy" />
  21.             </Columns>
  22.             <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
  23.             <EditRowStyle BackColor="#999999" />
  24.             <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
  25.             <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
  26.             <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
  27.             <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
  28.         </asp:GridView>

Can you please advice on how I can include the code into the above code.

Thanks
Last edited by peter_budo : May 31st, 2008 at 7:15 am. Reason: Keep It Organized - please use [code] tags
Reply With Quote  
•
•
Join Date: May 2008
Posts: 12
Reputation: Techbee is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 0
Techbee Techbee is offline Offline
Newbie Poster

Re: DataGrid View

  #7  
May 29th, 2008
•
•
•
•
Originally Posted by sebastian3 View Post
For storing Image try this :

Help with Code Tags 
 //UPLOAD FILE                   
                if (this.flBSmallImage.PostedFile.ContentLength > 0)
                {
                    if (strOldBSmallImage.Length > 0)
                    {
                        System.IO.File.Delete(Server.MapPath("../") + "UploadedFiles\\ManagementImage\\" + strOldBSmallImage.ToString());
                    }
                    String strPath = Server.MapPath("../") + "UploadedFiles/ManagementImage";
                    flBSmallImage.PostedFile.SaveAs(strPath + "/" + strBSmallImage);
                }


For viewing the Image, bind the Datgrid in backend and in aspx it should be :

Help with Code Tags 
   <ItemTemplate>
                                            <asp:Image ID="Image1" ImageUrl='<%# "../UploadedFiles/TemplateImage/" + ((clsTemplateImage)Container.DataItem).upload_image_name%>'
                                            height="71" width="171" AlternateText="" runat="server"/>
                                        </ItemTemplate>


Thanks Sebastian I managed upload and store the image in the Access Database but I have failed to assign the Imagefield to pick the Image using the URL and place it into the Gridview control.

My Gridview control has the following code:
Help with Code Tags
ASP.NET Syntax (Toggle Plain Text) 
  1. <asp:AccessDataSource ID="AccessDataSource1" runat="server" DataFile="~/database/myDatabase.mdb"
  2. SelectCommand="SELECT [ProductID], [Product_Name], [Product_Price], [Product_Description] FROM [Products]">
  3. </asp:AccessDataSource>
  4. </strong>
  5.  
  6. </div>
  7. <asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False"
  8. CellPadding="4" DataKeyNames="ProductID" DataSourceID="AccessDataSource1" ForeColor="#333333"
  9. GridLines="None">
  10. <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
  11. <Columns>
  12. <asp:BoundField DataField="ProductID" HeaderText="ProductID" InsertVisible="False"
  13. ReadOnly="True" SortExpression="ProductID" />
  14. <asp:BoundField DataField="Product_Name" HeaderText="Product_Name" SortExpression="Product_Name" />
  15. <asp:BoundField DataField="Product_Price" HeaderText="Product_Price" SortExpression="Product_Price" />
  16. <asp:BoundField DataField="Product_Description" HeaderText="Product_Description"
  17. SortExpression="Product_Description" />
  18. <asp:ImageField DataImageUrlField="ProductID" HeaderText="Image">
  19. </asp:ImageField>
  20. <asp:ButtonField Text="Buy" />
  21. </Columns>
  22. <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
  23. <EditRowStyle BackColor="#999999" />
  24. <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
  25. <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
  26. <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
  27. <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
  28. </asp:GridView>

Can you please advice on how I can include the code into the above code.

Thanks
Last edited by peter_budo : May 31st, 2008 at 7:16 am. Reason: Keep It Organized - please use [code] tags
Reply With Quote  
•
•
Join Date: May 2008
Posts: 34
Reputation: sebastian3 is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 1
sebastian3 sebastian3 is offline Offline
Light Poster

Re: DataGrid View

  #8  
May 30th, 2008
Its ok but u have to select the image url field in the select query and put the image url field in the Imagefield value.You have put
Help with Code Tags 
<asp:ImageField DataImageUrlField="ProductID" HeaderText="Image">
</asp:ImageField>
But u have to put the Image Url column name of your table like if the column in your table where u store the path is "imgpath" then it should be :
Help with Code Tags 
<asp:ImageField DataImageUrlField="imgpath" HeaderText="Image">
</asp:ImageField>
. One thing the path must be a absolute path that us tore in the database like : "UploadedFiles/ManagementImage/image1.jpg"
Otherwise if u store only the filename in the database then u have to insert the absolute path hardcoded.Then u could replace the asp:Imagefield with a templatefield :
<ItemTemplate><asp:Image ID="Image1" ImageUrl='<%# "../UploadedFiles/TemplateImage/" + (Container.DataItem).upload_image_name%>' runat="server"/></ItemTemplate>
Do let me know if it works.I would be available for further cooperation.
Last edited by sebastian3 : May 30th, 2008 at 2:58 am.
Reply With Quote  
•
•
Join Date: May 2008
Posts: 12
Reputation: Techbee is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 0
Techbee Techbee is offline Offline
Newbie Poster

Re: DataGrid View

  #9  
May 30th, 2008
•
•
•
•
Originally Posted by sebastian3 View Post
Its ok but u have to select the image url field in the select query and put the image url field in the Imagefield value.You have put
Help with Code Tags 
<asp:ImageField DataImageUrlField="ProductID" HeaderText="Image">
</asp:ImageField>
But u have to put the Image Url column name of your table like if the column in your table where u store the path is "imgpath" then it should be :
Help with Code Tags 
<asp:ImageField DataImageUrlField="imgpath" HeaderText="Image">
</asp:ImageField>
. One thing the path must be a absolute path that us tore in the database like : "UploadedFiles/ManagementImage/image1.jpg"
Otherwise if u store only the filename in the database then u have to insert the absolute path hardcoded.Then u could replace the asp:Imagefield with a templatefield :
<ItemTemplate><asp:Image ID="Image1" ImageUrl='<%# "../UploadedFiles/TemplateImage/" + (Container.DataItem).upload_image_name%>' runat="server"/></ItemTemplate>
Do let me know if it works.I would be available for further cooperation.


Thanks Sebastian, I've tried both codes unfortunately the first one did not return any images after putting the column of the table. The second one is reading an error. Please see below the code that I have included after replacing the Imagefield as you suggested.

Help with Code Tags 
<asp:BoundField DataField="ImagePath" HeaderText="ImagePath" SortExpression="ImagePath" />
                <asp:BoundField DataField="ImageName" HeaderText="ImageName" SortExpression="ImageName" />
                <asp:BoundField DataField="ProductID" HeaderText="ProductID" SortExpression="ProductID" />
                <ItemTemplate>
                <asp:Image ID = "Image1" ImageUrl="<%../UploadedFiles/TemplateImage/" + 
                (Container.DataItem).upload_image_name %>" runat="server" />
                 </ItemTemplate>


The error detected is highlighted in red.
Error Message: Code blocks are not supported in this context.

I do apologise for being a pain, I'm still trying to get the grips with programming.

Regards
Bright
Last edited by peter_budo : May 31st, 2008 at 7:16 am. Reason: Keep It Organized - please use [code] tags
Reply With Quote  
•
•
Join Date: May 2008
Posts: 34
Reputation: sebastian3 is an unknown quantity at this point 
Rep Power: 1
Solved Threads: 1
sebastian3 sebastian3 is offline Offline
Light Poster

Re: DataGrid View

  #10  
May 30th, 2008
Ok no problem, there is always second way.
Actually the code i sent u <ItemTemplate><asp:Image ID="Image1" ImageUrl='<%# "../UploadedFiles/TemplateImage/" + (Container.DataItem).upload_image_name%>' runat="server"/></ItemTemplate> this was for the particular path : "../UploadedFiles/TemplateImage/" .
U should have to change this path to your own image path where u have stored the image.
If u r working in Product.aspx say and the image is in images folder then the code will be
ImageUrl='<%# "images/" + (Container.DataItem).upload_image_name%>' If it is in a image folder in the parent directory then u have to put a ".." (dot dot) like ImageUrl='<%# "../images/" + (Container.DataItem).upload_image_name%>' If its in the current folder then just leave it blank : ImageUrl='<%# Container.DataItem).upload_image_name%>' I just sended u a example path, u have to change it as urs.

Another thing replace (Container.DataItem).upload_image_name with Eval("upload_image_name") .

Or u can do 1 thing , send me the files hierarchy in ur project , i will give u the Imageurl to use , OK .
Reply With Quote  
Reply
Page 1 of 2 1 2 >

•
•
•
•

Only community members can participate in forum threads. You must register or log in to contribute.

Register
•
•
•
•
•
•
•
•
DaniWeb ASP.NET Marketplace
•
•
•
•
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

 

•
•
•
•
Thread Tools Display Modes
Linear Mode Linear Mode

Similar Threads
Other Threads in the ASP.NET Forum

Advertising Opportunities on DaniWeb
Contact Us - Newsletter Archive - Sitemap - Privacy Statement
All times are GMT -4. The time now is 5:38 pm.
Forum system based on vBulletin Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
©2003 - 2008 DaniWeb® LLC