Displaying images in a web form (C#)

[liunx]

Hello

I have always had a problem with this and have never managed to get it right.

I am creating a shopping application and have many pictures that l want to display in a web form inside a datagrid.
I want to have the path of the picture in the database (SQL Server).

Someone told me to have all the pictures a folder called images, which l have done. But where about do l put this folder.

I never been able to get this right, can someone show me step by step on how to do this. I only need the bare minium code and help.

Many thanks in advance,

SteveI think its too easy, first you will create a folder called "images" and in create column in database called images also, you'll save your images path in database like this "images/image1", "images/image2", .. and so on.
Then here's how you can show your images in datagrid
<aspataGrid ID="DataGrid1" AutoGenerateColumns="False">
<Columns>
<TemplateColumn>
<ItemTemplate>
<img src='http://www.webdeveloper.com/forum/archive/index.php/<%# DataBinder.Eval(Container, "DataItem.Images") %>'>
</ItemTemplate>
</TemplateColumn>
</Columns>
</aspataGrid>
Hope this helps Hello

THaNks for the reply. just a few questions where abouts do l create the folder? Do l need to adjust any properties on the datagrid?

can you explain this line for me:
<img src='http://www.webdeveloper.com/forum/archive/index.php/<%# DataBinder.Eval(Container, "DataItem.Images") %>'>

many thanks for your help in advance

stevewell the images folder you'll create in you web directory where you keep your web pages, and this line you write in the HTML Code of the datagrid, i assume you know how to create a datagrid and bind to.look at this exapmle (<!-- m --><a class="postlink" href="http://www.webdeveloper.com/forum/showpost.php?p=466021&postcount=10">http://www.webdeveloper.com/forum/showp ... stcount=10</a><!-- m -->) it may helps, but just the portion of the VB code where i bind to the datagridHello Cipher,

Thanks for all your help my l am still having problems.
This is my code in the HTML

<Columns>
<asp:TemplateColumn>
<ItemTemplate>
<img src='http://www.webdeveloper.com/forum/archive/index.php/<%# DataBinder.Eval(Container.DataItem, "Images")%>'>
</ItemTemplate>
</asp:TemplateColumn>
</Columns>

I had top make a change container.dataitem, i kept on getting a error message. I have placed my image folder in the right place.

This is my code for connecting to the database:


private void Page_Load(object sender, System.EventArgs e)
{
// Put user code to initialize the page here
DataSet ds = new DataSet();
SqlDataAdapter da = new SqlDataAdapter();
try
{
string cnnStr = "Server=.; Database=HolidayPhotos; integrated security=true";
SqlConnection cnn = new SqlConnection();
cnn.ConnectionString = cnnStr;
cnn.Open();

SqlCommand cmd = cnn.CreateCommand();
cmd.CommandType = CommandType.Text;
cmd.CommandText = "SELECT * FROM MyPhotos";

da.SelectCommand = cmd;
da.Fill(ds,"MyPhotos");

this.DataGrid1.DataSource = ds;
this.DataGrid1.DataMember = "MyPhotos";
this.DataGrid1.DataBind();
}
catch ( SqlException ex )
{
Debug.WriteLine(ex.Message);
}
catch ( Exception ex )
{
Debug.WriteLine(ex.Message);
}
}


I in the auto format on the datagrid l added a template column.
My database is called HolidayPictures, the table is called MyPhotos.
Columns are PhotoID, Photo.
In the photo column i have for example "Images/pic1"

I would me most grateful if you can understand what has gone wrong. I know i am very close to finding a solution.

Many thanks for your time.

Steve<img src='http://www.webdeveloper.com/forum/archive/index.php/<%# DataBinder.Eval(Container.DataItem, "Images")%>'>

I think this line is very wrong, try this one as it is.
<img src='http://www.webdeveloper.com/forum/archive/index.php/<%# DataBinder.Eval(Container, "DataItem.Photo")%>'>Hello Cipher,

Thanks for all your help.

I think this might be a stupid question. I and l think l could understand my problem a lot more if understood this line does.

<img src='http://www.webdeveloper.com/forum/archive/index.php/<%# DataBinder.Eval(Container, "DataItem.Photo")%>'>

Thanks for your help,

SteveWell i'm not very good to explain this stuff, but its to take item from the DataSource, "exataBase", and assign it to any control you want.
This example takes the value of Photo column and assign it to the <img> tag
so if you have in your photo column value like this "photos/photo1.jpg"
it will be assigned like this to img <img src='http://www.webdeveloper.com/forum/archive/index.php/photos/photo1.jpg'>
Hope you understood anything! <img src='http://www.webdeveloper.com/forum/archive/index.php/<%# DataBinder.Eval(Container, "DataItem.Photo")%>'>


1) <img xxx> is html tag recongized by aspx
2) src, is one of the attribute from <img> that tells html where your source is located. (i.e: c:\img\pic1.jpeg)
3) <%# ..... %> is a "single value data binding" expression that reconigzed by aspx.
3a) single value data binding is just a diff approach to dynamic text (i.e. <%=blah%> from asp or jsp)
3b) when call DataBind() method for the page, text will be replaced with the value from ur code-behind
4) DataBinder.Eval is a static Eval() method from System.Web.UI.DataBinder class. it takes 2 parameters: data source, and the field or the property you wanted to display from that source.
4a) u use Container.DataItem property to specify the data source that's boun to the current control (in ur code-behind, you did this.DataBind();
4b) DataItem.Photo, the Photo is the name of your col off your DataSet, and your DataSet is (or is not) off your sql table.woow, i'd never say better, Thank you sirpelidor Hello,

Thanks for your help guys.

I had to make some changes but managed to solve the problem.
In my database in the column l have Images/picture1.jpg Images/picture2.jpg without the double quotes. Does work with double quotes.


<Columns>
<asp:BoundColumn DataField="PhotoID" HeaderText="ID" >
</asp:BoundColumn>
<asp:TemplateColumn>
<ItemTemplate>
<img src='http://www.webdeveloper.com/forum/archive/index.php/<%# DataBinder.Eval(Container, "DataItem.Photo") %>'>
</ItemTemplate>
</asp:TemplateColumn>
</Columns>


There is one question, if l wanted to click on picture to display another webform, how would l have to change the code to do that. If you can't answer that question, don't worry. I think you have helped me enough all ready.

Many thanks for you help,

Steve