Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

Get image URL from Access database and display in gridview

Posted on 2006-04-01
26
Medium Priority
?
8,614 Views
Last Modified: 2008-01-09
Probably pretty basic but I'm just learning...

Using Visual Studio 2005, Visual Basic, Access Database.

What I would like to do is change the ProductImage part. In my database, I have the names of the images: image1.gif, image2.gif, etc. I'd like to have the ProductImage get the URL in the form of images/image1.gif.

I built a gridview based on dataset that results in this:
 <Fields>
                    <asp:BoundField DataField="CategoryID" HeaderText="CategoryID" SortExpression="CategoryID" />
                    <asp:BoundField DataField="ModelNumber" HeaderText="ModelNumber" SortExpression="ModelNumber" />
                    <asp:BoundField DataField="ModelName" HeaderText="ModelName" SortExpression="ModelName" />
                    <asp:BoundField DataField="UnitCost" HeaderText="UnitCost" SortExpression="UnitCost" />
                    <asp:BoundField DataField="Description" HeaderText="Description" SortExpression="Description" />
                    <asp:BoundField DataField="ProductImage" HeaderText="ProductImage" SortExpression="ProductImage" />
                     </Fields>

Is that clear enough? Can anyone help? Like I said, I'm just learning so if your answer requires any kind of function stuff you'll have to tell me where it goes and how to use it. 500 points because I'm completely stoopid and need step-by-step instructions.

Thanks,

MH
0
Comment
Question by:MHenry
  • 14
  • 10
25 Comments
 
LVL 7

Author Comment

by:MHenry
ID: 16355039
BTW, I don't care if the image is displayed inside the grid. In fact, I would prefer that it's not. I just did it like that to show the field ProductImage.

Best,

MH
0
 
LVL 3

Expert Comment

by:Brentxhange
ID: 16355063
is this just returning 1 result, or is it returning multiple results w/pictures?
0
 
LVL 7

Author Comment

by:MHenry
ID: 16355415
The gridview is returning all the stuff listed above. I want the picture to be the picture that matches with the ProductID returned in the grid. It's just the one picture associated with that ProductID.

0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 3

Expert Comment

by:Brentxhange
ID: 16355555
no, thats not what i mean, will there be multiple records like:

   CategoryID | ModelNumber | ModelName | UnitCost | Description | ProductImage
   
   record 1     |    record 1     |  record 1     |record 1  |record 1     |record 1    
   record 2     |    record 2     |  record 2     |record 2  |record 2     |record 2    
 ........
 or will there be just  record?? (only 1 picture to diplay or multiple pictures)
0
 
LVL 7

Author Comment

by:MHenry
ID: 16355580
This is for the details page. It will have the detailview with just one set of information (like above). I want to add the picture somewhere on the page.
0
 
LVL 3

Expert Comment

by:Brentxhange
ID: 16355659
ok, thanks, can u send my the "Select Statment" (including where statments) and I can develop the code for you.  It will be a server side script that will create a picture from the location given in the database record.
0
 
LVL 7

Author Comment

by:MHenry
ID: 16355699
Hopefully you mean this:

SELECT CategoryID, Description, ModelName, ModelNumber, ProductID, ProductImage, UnitCost FROM Products WHERE (ProductID = ?)

Thanks,

MH
0
 
LVL 3

Expert Comment

by:Brentxhange
ID: 16355734
I also need the paramater (where the "(ProductID = ?)" gets the "?"from if that makes sense.  eg. <asp paramater name=ProductID ....../>
0
 
LVL 3

Expert Comment

by:Brentxhange
ID: 16355822
ok, your code will look somthing like this.  This should work but may have a runtime error because I just wrote this without an editor:

<%@ Import Namespace="System" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Web" %>
<%@ Import Namespace="System.UI.WebControls" %>
<%@ Import Namespace="System.Data.OleDb" %>
<%@ Import Namespace="System.Data.SqlClient" %>
<%@ Import Namespace="System.Configuration" %>
<%@ Import Namespace="System.Web.Configuration" %>

<Script runat=server>
Sub Page_Load(ByVal s As object, byval e as eventargs)
Dim connection As OleDbConnection
Dim command As OLEDBCommand
Dim reader As OLEDBDataReader
Dim connstr As String
Dim sqlstr As String
Try
'Change this to your connection string or change the name if your connection string is in the web.config file
connstr = ConfigurationManager.ConnectionStrings("ConnectionString").ConnectionString
connection = New OLEDbConnection(connstr)
connection.open()
'connection now open to database, creating select statment
sqlstr = "SELECT ProductImage, UnitCost FROM Products WHERE (ProductID = ?)"
command = New OLEDBCOMMAND(sqlstr, connection)
'defines where statment parameters
command.Parameters.Add(New OleDbParameters("ProductID" , *****NEEDS TO BE FILLED***))
reader = command.executereader()
reader.read()
Dim picstr As String = reader.getvalue("0")
dim pic as System.Web.UI.WebControls.Image ();
pic.imageurl = picstr
PlaceHolder1.controls.add(pic)
Finally
If(Not ISNothing(reader)) THen
connection.close()
End If
If (Not ISNothing(Connection)) Then
Connection.Close
End If
End Try
End Sub

</script>

<asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
0
 
LVL 7

Author Comment

by:MHenry
ID: 16355829
I'm guessing that would be the string from the master page:

details.aspx?ProductId={0}

The full text from the source code is:
<asp:HyperLinkField DataNavigateUrlFields="ProductID" DataNavigateUrlFormatString="details.aspx?ProductID={0}"
                HeaderText="Details" Text="Details" />



0
 
LVL 7

Author Comment

by:MHenry
ID: 16355968
Brentxhange
Not sure if it matters, but I am using Master/Child pages. I just slapped all the stuff right under this:
<%@ Page Language="VB" MasterPageFile="~/MasterPage.master" AutoEventWireup="false" CodeFile="details.aspx.vb" Inherits="details" title="Untitled Page" %>


Ok, not sure if I got the connection string right. It is in the config file so I used this:
connstr = ConfigurationManager.ConnectionStrings("zxvu1151ConnectionString").


So far, these errors:
OleDbParameters is not defined
dim pic as System.Web.UI.WebControls.Image ();   *Says the ; is not valid*
pic.imageurl = picstr  *Name pic is not declared
PlaceHolder1.controls.add(pic)  *PlaceHolder is not declared

Is this correct for the "needs to be replaced?"
command.Parameters.Add(New OleDbParameters("ProductID" , details.aspx?ProductId={0}))

Thanks,

MH
0
 
LVL 3

Expert Comment

by:Brentxhange
ID: 16356018
ok....#1 AutoEvenWireup="true"
       #2 The ";" should not be there, my mistake
       #3 in the imports I forgot to put this "<%@ Import Namespace="System.Web.UI.WebControls.Image" %>"
       #4 I think the command is correct, once the rest works try it and let me know.

I think thats all that needs to be corrected.  Let Me know

Brent
0
 
LVL 7

Author Comment

by:MHenry
ID: 16356041
Should that be AutoEventWireup?

And where does it go?
0
 
LVL 3

Expert Comment

by:Brentxhange
ID: 16356188
yes, autoeventwireup.  It goes in the page header, with the page directive
0
 
LVL 7

Author Comment

by:MHenry
ID: 16356237
Ok, still have these errors:

OleDbParameters is not defined
pic.imageurl   **image.url is not a member of "System Array"
PlaceHolder1.controls.add(pic)  **value of type '1 dimensional array of System.Web.UI.Webcontrols.Image' cannot be converted to 'System.Web.UI.Control'

Also says the question mark is not a valid character here:
command.Parameters.Add(New OleDbParameters("ProductID" , details.aspx?ProductId={0}))

0
 
LVL 7

Author Comment

by:MHenry
ID: 16357783
Just in case anyone else is looking for a similar answer:

Believe it or not, this is relatively simple. But not obvious to a newbie - like me. This works in 2005 anyway...

After three or four hours of searching and playing around, I found that if you go into the "edit fields" screen of the detailsview, there is an "imageField."

Add the imageField to the selected fields.
Select it in the selectedFields window.
Scroll down until you find the data section.
In dataImageURLField, choose the field where you have the image information, ie "image.gif"
In dataImageURLFormat, type: images/{0}  

That is assuming your image is in a images subdirectory.

This works in my case anyway. The field I was using wasn't even a query field, just a field in the table.

Oh yeah, it helps if you actually have the image in the folder you are pointing to. After banging my head on the floor for a couple of hours, I thought maybe I should make sure the image I was looking for was in there. Of course, it wasn't.

Best,

MH
0
 
LVL 7

Author Comment

by:MHenry
ID: 16408270
Brentxhange,

I'll still award the points if you want to help me work out those two errors. I'd still like to know how to get the image outside of the grid.

Didn't mean to make it sound like I had found the answer I was looking for.

Best,
MH
0
 
LVL 3

Expert Comment

by:Brentxhange
ID: 16408459
I will have a chance to look over this later today, I was on holidays for the past few.  I believe that there is somthing missing from the page inherits.  Could you please post the entire page code (once again), so I can make sure all the requred elements are present.

Thanks
0
 
LVL 7

Author Comment

by:MHenry
ID: 16409685
Brentxhange,

Here's what I have. I wasn't sure what to put in the "needs to be filled" area...

<%@ Page Language="VB" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="details.aspx.vb" Inherits="details" title="Untitled Page" %>
<%@ Import Namespace="System" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Web" %>
<%@ Import Namespace="System.UI.WebControls" %>
<%@ Import Namespace="System.Data.OleDb" %>
<%@ Import Namespace="System.Data.SqlClient" %>
<%@ Import Namespace="System.Configuration" %>
<%@ Import Namespace="System.Web.Configuration" %>
<%@ Import Namespace="System.Web.UI.WebControls.Image" %>
<Script runat=server>
Sub Page_Load(ByVal s As object, byval e as eventargs)
Dim connection As OleDbConnection
Dim command As OLEDBCommand
Dim reader As OLEDBDataReader
Dim connstr As String
Dim sqlstr As String
Try
'Change this to your connection string or change the name if your connection string is in the web.config file
            connstr = ConfigurationManager.ConnectionStrings("ConnectionString").ConnectionString
connection = New OLEDbConnection(connstr)
connection.open()
'connection now open to database, creating select statment
sqlstr = "SELECT ProductImage, UnitCost FROM Products WHERE (ProductID = ?)"
command = New OLEDBCOMMAND(sqlstr, connection)
'defines where statment parameters
command.Parameters.Add(New OleDbParameters("ProductID" , details.aspx?ProductId={0}))
reader = command.executereader()
reader.read()
Dim picstr As String = reader.getvalue("0")
            Dim pic As System.Web.UI.WebControls.Image()
pic.imageurl = picstr
PlaceHolder1.controls.add(pic)
Finally
If(Not ISNothing(reader)) THen
connection.close()
End If
If (Not ISNothing(Connection)) Then
Connection.Close
End If
End Try
End Sub

</script>

    <h1>
        Product List</h1>
    <p>
        &nbsp;</p>
    <p>
    <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
        <asp:DetailsView ID="DetailsView1" runat="server" AutoGenerateRows="False" CellPadding="4"
            DataSourceID="ObjectDataSource1" ForeColor="#333333" GridLines="None" Height="50px"
            Width="100%">
            <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <CommandRowStyle BackColor="#E2DED6" Font-Bold="True" />
            <EditRowStyle BackColor="#999999" />
            <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
            <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
            <Fields>
                <asp:BoundField DataField="ProductID" HeaderText="ProductID" SortExpression="ProductID" />
                <asp:BoundField DataField="ModelName" HeaderText="ModelName" SortExpression="ModelName" />
                <asp:BoundField DataField="TotalNum" HeaderText="TotalNum" SortExpression="TotalNum" />
            </Fields>
            <FieldHeaderStyle BackColor="#E9ECF1" Font-Bold="True" />
            <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
        </asp:DetailsView>
        <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" OldValuesParameterFormatString="original_{0}"
            SelectMethod="GetData" TypeName="productListTableAdapters.CustomerAlsoBoughtTableAdapter">
        </asp:ObjectDataSource>
    </p>
    <p>
        <a href="storeHome.aspx"><span style="color: #0000ff; text-decoration: underline">back</span></a></p>
   
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="RightPlaceHolder" Runat="Server">
    <br />
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataSourceID="ObjectDataSource1">
        <Columns>
            <asp:BoundField DataField="ModelName" HeaderText="ModelName" SortExpression="ModelName" />
            <asp:BoundField DataField="TotalNum" HeaderText="TotalNum" SortExpression="TotalNum" />
            <asp:HyperLinkField DataNavigateUrlFields="ProductID" DataNavigateUrlFormatString="details.aspx?ProductID={0}"
                HeaderText="details" Text="GoTo" />
        </Columns>
    </asp:GridView>
</asp:Content>

Best,

MH
0
 
LVL 7

Author Comment

by:MHenry
ID: 16409750
Brentxhange,

Here's the code if I put the image inside the details view. Is there maybe a way to grab the image from this somehow?



<%@ Page Language="VB" MasterPageFile="~/MasterPage.master" AutoEventWireup="false" CodeFile="details.aspx.vb" Inherits="details" title="Untitled Page" %>

    <h1>
        Product List</h1>
    <p>
        &nbsp;</p>
    <p>
        &nbsp;<asp:DetailsView ID="DetailsView1" runat="server" AutoGenerateRows="False" CellPadding="4"
            DataSourceID="ObjectDataSource1" ForeColor="#333333" GridLines="None" Height="50px"
            Width="100%">
            <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <CommandRowStyle BackColor="#E2DED6" Font-Bold="True" />
            <EditRowStyle BackColor="#999999" />
            <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
            <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
            <Fields>
                <asp:BoundField DataField="ProductID" HeaderText="ProductID" InsertVisible="False"
                    SortExpression="ProductID" />
                <asp:BoundField DataField="ModelName" HeaderText="ModelName" SortExpression="ModelName" />
                <asp:BoundField DataField="UnitCost" HeaderText="UnitCost" SortExpression="UnitCost" />
                <asp:BoundField DataField="Description" HeaderText="Description" SortExpression="Description" />
                <asp:ImageField DataImageUrlField="ProductImage" DataImageUrlFormatString="images/{0}">
                </asp:ImageField>
               
            </Fields>
            <FieldHeaderStyle BackColor="#E9ECF1" Font-Bold="True" />
            <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
        </asp:DetailsView>
        <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" OldValuesParameterFormatString="original_{0}"
            SelectMethod="GetDataByProductID" TypeName="productListTableAdapters.ProductsTableAdapter">
            <SelectParameters>
                <asp:QueryStringParameter Name="ProductID" QueryStringField="ProductID" Type="Int32" />
            </SelectParameters>
        </asp:ObjectDataSource>
    </p>
0
 
LVL 7

Author Comment

by:MHenry
ID: 16581100
I hate to see this one closed without an answer. He got really close. If anyone else can supply a working answer, I'd be happy to split points. The way the answer is right now, it doesn't work.

MH
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 16604419
Where in lies the problem?  What doesn't work?

Bob
0
 
LVL 3

Expert Comment

by:Brentxhange
ID: 16605126
Hi, I'm sorry about the wait, this has really stupmed me and my computer crashed :(
it is almost idntical except you are missing 1 thin in the <asp:imageField> code
Try this code:

<%@ Page Language="VB" MasterPageFile="~/MasterPage.master" AutoEventWireup="false" CodeFile="details.aspx.vb" Inherits="details" title="Untitled Page" %>

    <h1>
        Product List</h1>
    <p>
        &nbsp;</p>
    <p>
        &nbsp;<asp:DetailsView ID="DetailsView1" runat="server" AutoGenerateRows="False" CellPadding="4"
            DataSourceID="ObjectDataSource1" ForeColor="#333333" GridLines="None" Height="50px"
            Width="100%">
            <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <CommandRowStyle BackColor="#E2DED6" Font-Bold="True" />
            <EditRowStyle BackColor="#999999" />
            <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
            <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
            <Fields>
                <asp:BoundField DataField="ProductID" HeaderText="ProductID" InsertVisible="False"
                    SortExpression="ProductID" />
                <asp:BoundField DataField="ModelName" HeaderText="ModelName" SortExpression="ModelName" />
                <asp:BoundField DataField="UnitCost" HeaderText="UnitCost" SortExpression="UnitCost" />
                <asp:BoundField DataField="Description" HeaderText="Description" SortExpression="Description" />
                <asp:ImageField DataImageUrlField="ProductImage" DataImageUrlFormatString="../images/{0}">
                </asp:ImageField>
               
            </Fields>
            <FieldHeaderStyle BackColor="#E9ECF1" Font-Bold="True" />
            <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
        </asp:DetailsView>
        <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" OldValuesParameterFormatString="original_{0}"
            SelectMethod="GetDataByProductID" TypeName="productListTableAdapters.ProductsTableAdapter">
            <SelectParameters>
                <asp:QueryStringParameter Name="ProductID" QueryStringField="ProductID" Type="Int32" />
            </SelectParameters>
        </asp:ObjectDataSource>
    </p>
0
 
LVL 3

Accepted Solution

by:
Brentxhange earned 2000 total points
ID: 16605177
or try pasting this code outside of the datagrid(in the main page)

<asp:formview id="FormView1" runat="server" datasourceid="ObjectDataSource1" cellpadding="0" borderwidth="0px" enableviewstate="False">
                        <ItemTemplate>
                              <h4>
                                                <img src="..images/<%# Eval("ProductImage") %>" </h4>
                              <hr />
                        </ItemTemplate>
                  </asp:formview>
0
 
LVL 7

Author Comment

by:MHenry
ID: 16612230
Brentxhange,

Well, believe it or not it worked! I didn't try the longer answer yet, the second one you supplied was so much simpler and elegant I thought I would give it a shot first.

The only thing was you left off the closing bracket on the image tag, so just for anyone who might search for this, the answer that worked is:

<asp:formview id="FormView1" runat="server" datasourceid="ObjectDataSource1" cellpadding="0" borderwidth="0px" enableviewstate="False">
                    <ItemTemplate>
                         <h4>
                                        <img src="..images/<%# Eval("ProductImage") %>"> </h4>
                         <hr />
                    </ItemTemplate>
               </asp:formview>

Fantastic work, my friend. You more than earned the points!

My thanks,

MH
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I think the Typed DataTable and Typed DataSet are very good options when working with data, but I don't like auto-generated code. First, I create an Abstract Class for my DataTables Common Code.  This class Inherits from DataTable. Also, it can …
Calculating holidays and working days is a function that is often needed yet it is not one found within the Framework. This article presents one approach to building a working-day calculator for use in .NET.
Look below the covers at a subform control , and the form that is inside it. Explore properties and see how easy it is to aggregate, get statistics, and synchronize results for your data. A Microsoft Access subform is used to show relevant calcul…
With just a little bit of  SQL and VBA, many doors open to cool things like synchronize a list box to display data relevant to other information on a form.  If you have never written code or looked at an SQL statement before, no problem! ...  give i…
Suggested Courses

810 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question