Failing to display an image in gridview. No error messages, just displays the image icon instead of actual image from database
I have a gridview, and I am using RowDataBound event to displays information in labels. I have an Image control in the gridview
<asp:TemplateField HeaderText="Picture">
<ItemTemplate>
<asp:Image ID="imgPicture" runat="server" />
</ItemTemplate>
</asp:TemplateField>
The image path is stored in database under a column called Image like Images\image.jpg
It's stored in a folder called Images in the solution
RowDataBound
Image imgPicture = (Image)e.Row.FindControl("imgPicture");
if ((imgPicture != null))
{
imgPicture.ImageUrl = #"~\Images\" + (string)DataBinder.Eval(e.Row.DataItem, "Image");
}
i would not use the RowDataBound-Event:
<asp:TemplateField HeaderText="Picture">
<ItemTemplate>
<asp:Image ID="imgPicture" runat="server" ImageUrl='<%# Eval("Image", "~/Images/{0}") %>' />
</ItemTemplate>
</asp:TemplateField>
Related
I have a image stored in database and it is displayed in Gridview. When i click the image it will pop up as zommed image.
The issue here is image displayed in gridview increases the gridview column height, i decreased the height but the pop up stopped working correctly.
so is it possible to bind the image with URL, i didn't know to work on it.
<asp:TemplateField HeaderText="Image">
<ItemTemplate>
<asp:Image ID="Image1" runat="server"/>
</ItemTemplate>
</asp:TemplateField>
You should set your image size for exemple :
<asp:TemplateField HeaderText="Image">
<ItemTemplate>
<asp:Image ID="Image1" runat="server" style="width:40px;height:50px;"/>
</ItemTemplate>
</asp:TemplateField>
If you use width and height properties, your image may lost the width-height ratio. You can set only width for exemple to keep the right width height rate.
Or you can use thumbnails for your grid. I mean, you can use a resized image to show in the grid and when you click on the image, you can pop up the real size image.
If the image is uploaded via your interface, at the moment of the saving the image on the server, you should redimension the image in order to save a thumbnail image.
To resize an image :
How to resize an Image C#
Try below block of code,
//Bind from db
<asp:TemplateField HeaderText="Image">
<ItemTemplate>
<asp:Image ID="Image1" runat="server" ImageUrl='<%#Eval("ImageSrc") %>' style="width:40px;height:50px;"/>
</ItemTemplate>
</asp:TemplateField>
//Bind from local
<asp:TemplateField HeaderText="Image">
<ItemTemplate>
<asp:Image ID="Image1" runat="server" ImageUrl="../Images/ABC.jpg" style="width:40px;height:50px;"/>
</ItemTemplate>
</asp:TemplateField>
I am trying to create a column in a GridView that contains a button and can be clicked on to select the row. When I try to assign an ImageURL (that exists) to the button, it does not display and seems as if the link is broken. Here's the code I am using:
<asp:ButtonField HeaderText="Select" ButtonType="Image" CommandName="Select" ImageUrl="../Images/SemiWorksPLM/unchecked.png"/>
However I can create an Image inside a TemplateField using the same URL and it appears okay:
<asp:TemplateField HeaderText="Select">
<ItemTemplate>
<asp:Image ID="Image1" ImageUrl="../Images/SemiWorksPLM/unchecked.png" runat="server" />
</ItemTemplate>
</asp:TemplateField>
Any idea why it would work for the Image in the TemplateField but not the ButtonField?
you could try doing it the next way:
1 - Change ButtonType to to link
2 - put the image in the text area
<asp:ButtonField CommandName="Preview" Text="<img src='Images/SemiWorksPLM/unchecked.png' style='border-width:0' />" ButtonType="Link" />
Try using a url relative the the root directory of the website:
ImageUrl="~/Images/Image2.bmp"
I am now developing windows application using c#.net.
now i want to add four image buttons in datagridview cell like following picture.
Is it possible to do it? is there any control to do as the following picture.
Best Rgds,
DF
You need to add a template field as a column in your grid view. Then in the item template you can put asp image buttons. For example:
<asp:GridView runat="server" id="gdv_gridviewname" >
<Columns>
<asp:TemplateField HeaderText="Image Buttons">
<ItemTemplate>
<asp:ImageButton runat="server" ID="imgBtnSomething" ImageURL="Path to your image" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
I am importing a column in datatable to my grid. Now I want navigate to a new page on selecting a cell in grid by fetching the selected value. I have tried this by including bound field in my grid like
<asp:GridView ID="GDV_1" runat="server" EnableModelValidation="true" AutoGenerateColumns="false" OnSelectedIndexChanged="GDV_1_SelectedIndexChanged" AutoGenerateSelectButton="false" DataKeyNames="SROID">
<Columns>
<asp:BoundField DataField="SRONameinEnglish" HtmlEncode="False" DataFormatString="<a target='_blank' href='Test.aspx?code={0}>ClickHere</a>" />
</Columns>
</asp:GridView>
Doing this way my requirement is achieved but the all cells are displaying Common text Click here instead of showing data from Database.
Please give your suggestion on how to get the value from database into cell and make it clickable. I don't want to use Select button. Please find my current output.
This is my current output I want my data from DB instead of ClickHere.
You can use TemplateField
<asp:TemplateField HeaderText="Name">
<ItemTemplate>
<asp:LinkButton runat="server" ID="lnk<%# Eval("SRONameinEnglish")%>"><%# Eval("SRONameinEnglish")%></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
and click of LinkButton put your code to navigate anywhere.
In your case you are binding boundfield with static a tag which have href attribute so your not able to change text on that boundfield from your database.To get your approach you should
use TemplateField and bind data with text attribute using eval keyword as below example.
Try it:
<asp:TemplateField HeaderText="Name">
<ItemTemplate>
<asp:HyperLink ID="HyperLink1" runat="server" Text='<%# Eval("name") %>' />
</ItemTemplate>
</asp:TemplateField>
OR
you can also bind link with your hyperlink using NavigateUrl property of hyperlink as below example.
<asp:TemplateField HeaderText="Name">
<ItemTemplate>
<asp:HyperLink id="HyperLink2" NavigateUrl='<%#Eval("YourUrl") %>' Text='<%#Eval("name") %>' runat="server"/>
</ItemTemplate>
</asp:TemplateField>
I hope it will helpful to you.
In ASP.NET 2.0 web application, there is a gridview and user wanted to change the font size of contents of that grid view. Below is Gridview definition and server side code to set the font-size of contents of gridview. Everything is fine except, textboxes in bounded fields of gridview. The font size does not applied on them.
GridView :
<asp:TemplateField HeaderText="Display Name" HeaderStyle-HorizontalAlign="Left" ItemStyle-HorizontalAlign="Left">
<ItemTemplate>
<asp:TextBox ID="TextBox1" runat="server" Width="100px" Text='<%# Bind("DisplayName") %>' OnTextChanged="TextBox_TextChanged" />
<asp:HiddenField ID="HiddenField1" runat="server" Value='<%# Eval("DisplayName") %>' />
</ItemTemplate>
</asp:TemplateField>
ServerSide Code:
ObjPListSetting.Style["font-size"] = sTextSize + "px";
where, sTextSize is target value (i.e. 12, 14, 16).
Why is that so? Anyone can help in this regard.
In the OnRowDataBound event hander do something like this.
TextBox txtTextBox1 = RowObject.FindControl("TextBox1");
txtTextBox1.Style["font-size"] = sTextSize + "px";
This is a dummy code. Just check how you get the rowobject in below link.
http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.gridview.rowdatabound.aspx