Datagrid images problem

  • Thread starter Thread starter Celine
  • Start date Start date
C

Celine

I am building a website using C#, asp.net and SqlServer. I need to
store a lot of images in my database. I need to store thumbnails but
also larger pictures(when user clicks thumbnails a larger picture is
displayed). For doing that I was told to store only the URL's. My
problem now is how to display these images. I know that the tag <img>
is recognised by the datagrid and allow an easy display of a picture.
But I don't think storing the url with this tag is a good way for
doing it. And also how can I display several pictures on a same row?
Any help, articles, documentation would be really good.
Thanks
Celine
 
Hi Celine,


Are you storing the images in the DB or not?

If you are then you need to retrieve them and show them, this is not a
trivial thing.

If you are only storing the URL then it's very easy, it all depend of how
you define your datagrid. below you will find an piece of code what shows
you how to do it.

in the aspx file ( declaration of the datagrid ):


<asp:datagrid id=recordgrid runat="server" ShowHeader="false"
autoGenerateColumns="False" >
<SelectedItemStyle CssClass="resultrow">
</SelectedItemStyle>
<itemstyle CssClass="listrecordrow" Width="22px" />
<columns>
<asp:templatecolumn ItemStyle-Height="22" ItemStyle-VerticalAlign="Middle"
ItemStyle-Width="25" ItemStyle-HorizontalAlign="Center" >
<itemtemplate>
<img src="<%# ((DataRowView)Container.DataItem)["ImageUrl"] %>" >
</itemtemplate>
</asp:templatecolumn>
</columns>
</asp:datagrid>


As you can see all you have to do is using binding set the value of the src
property of the img tag

then in the code behind you can do:

recordgrid.DataSource = GenerateDataSource( ) ;
recordgrid.DataBind();


Hope this help,
 
Thanks for your help.
Yes, I store only the URLs in my database.
I didn't managed to make your code work but I changed some of it to
make it work. Here is the code I used:
<asp:datagrid id="recordgrid" runat="server" ShowHeader="false"
autoGenerateColumns="False">
<SelectedItemStyle CssClass="resultrow"></SelectedItemStyle>
<itemstyle CssClass="listrecordrow" Width="22px" />
<columns>
<asp:templatecolumn ItemStyle-Height="22"
ItemStyle-VerticalAlign="Middle" ItemStyle-Width="25"
ItemStyle-HorizontalAlign="Center">
<itemtemplate>
<img src='<%# DataBinder.Eval(Container.DataItem, "PhotoName",
"{0:c}") %>' >
</itemtemplate>
</asp:templatecolumn>
</columns>
</asp:datagrid>

Sorry to bother but I still got 2 questions. Is it possible to convert
this column to an hyperlink column so that when the user clicks the
picture a larger one is displayed?
And is it possible to display several thumbnails on the same row(i.e 5
thumbnails per row)instead of having each of them on different rows?
Thanks
Celine



Ignacio Machin \( .NET/ C# MVP \) said:
Hi Celine,


Are you storing the images in the DB or not?

If you are then you need to retrieve them and show them, this is not a
trivial thing.

If you are only storing the URL then it's very easy, it all depend of how
you define your datagrid. below you will find an piece of code what shows
you how to do it.

in the aspx file ( declaration of the datagrid ):


<asp:datagrid id=recordgrid runat="server" ShowHeader="false"
autoGenerateColumns="False" >
<SelectedItemStyle CssClass="resultrow">
</SelectedItemStyle>
<itemstyle CssClass="listrecordrow" Width="22px" />
<columns>
<asp:templatecolumn ItemStyle-Height="22" ItemStyle-VerticalAlign="Middle"
ItemStyle-Width="25" ItemStyle-HorizontalAlign="Center" >
<itemtemplate>
<img src="<%# ((DataRowView)Container.DataItem)["ImageUrl"] %>" >
</itemtemplate>
</asp:templatecolumn>
</columns>
</asp:datagrid>


As you can see all you have to do is using binding set the value of the src
property of the img tag

then in the code behind you can do:

recordgrid.DataSource = GenerateDataSource( ) ;
recordgrid.DataBind();


Hope this help,

--
Ignacio Machin,
ignacio.machin AT dot.state.fl.us
Florida Department Of Transportation

Celine said:
I am building a website using C#, asp.net and SqlServer. I need to
store a lot of images in my database. I need to store thumbnails but
also larger pictures(when user clicks thumbnails a larger picture is
displayed). For doing that I was told to store only the URL's. My
problem now is how to display these images. I know that the tag <img>
is recognised by the datagrid and allow an easy display of a picture.
But I don't think storing the url with this tag is a good way for
doing it. And also how can I display several pictures on a same row?
Any help, articles, documentation would be really good.
Thanks
Celine
Click to expand...
Click to expand...
 
Back
Top