We Keep Coding

How to bind Image with URL in Gridview - ASP.Net

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>

Retrieving a URL parameter and passing it into a HyperLinkField inside GridView

I'm trying to retrieve a URL parameter and pass it into a HyperLinkField inside my GridView.
The URL looks like http://application.com/dynamic.aspx?locale=us. I need to pull the value of the locale param and include it in the asp:HyperLinkField. I know that I can retrieve this param in the code behind like this:
Request.QueryString["locale"].ToString()
But is it possible to retrieve this value inside the .aspx?
<asp:HyperLinkField DataTextField="ref_id" DataNavigateUrlFields="???,ref_id" DataNavigateUrlFormatString="dynamic.aspx?locale={0}&id={1}" Text="ID" HeaderText="ID" SortExpression="ref_id" >

Better switch to a TemplateField. You have much more control that way.
<asp:TemplateField HeaderText="ID">
<ItemTemplate>
<asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl='<%# string.Format("/dynamic.aspx?locale={0}&id={1}", Request.QueryString["locale"], Eval("ref_id")) %>'><%# Eval("ref_id") %></asp:HyperLink>
</ItemTemplate>
</asp:TemplateField>

Image link not working for GridView ButtonField

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"

DataNavigateUrlFields navigating to subfolder instead of correct location.

I have a datagrid that needs one of the fields to hyperlink to a document housed on another server. The path is in this format: \\server\location\file.doc, but when I click on the cell in the data grid it becomes: http://myASPServer/Subfolder/server/location.file.doc. Is there any way that I can force this to go to the correct location? I know that you can prevent this for external websites by adding ftp:// or http://, but this does not seem to work for opening up this server location. Any suggestions?

I believe your answer can be found here on the asp.net forums http://forums.asp.net/t/1140909.aspx/1 - accepted answer from there below for your convenience.
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:HyperLink Text="TextField" id="myHL" runat="server"
NavigateUrl='<%# "file:///" + DataBinder.Eval(Container.DataItem, "Path").ToString() %>'></asp:HyperLink>
</ItemTemplate>
</asp:TemplateField>
</Columns>
I believe you need to prefix your links with file:/// for it would be file:///\\server\location\file.doc

GridView-generated code adds "width='100%'" to the table it creates

My page looks correct in Firefox and IE8. But in IE7, a nested gridview spills into the adjacent cell, much like the issue here.
Looking at it in the developer tools, there is an inline-style associated with the table that ASP.NET generated, and it has a width attribute of 100%. If I remove this, the nested table pops back where it belongs.
Problem is, nowhere is an inline-style set. In fact, if I try to set width='250px', it gets overridden with width='100%'. If I try to remove the width attribute in the code-behind, attrGridView.Attributes["Width"] is null, and calling .Remove() does nothing. But every asp.net-generated gridview-table has an inline style with width='100%' set on it (it's only causing me issues in one place).
Setting table-layout='fixed', as suggested in the article I linked to, did not help.
How do I get ASP.NET to stop setting this property?
Some code:
<asp:TemplateField HeaderText="Attributes" SortExpression="Attributes">
<HeaderStyle CssClass="GridHeaderCell" />
<ItemStyle CssClass="GridTableCell AttrGridCellPadding" />
<ItemTemplate>
<asp:GridView id="attributesGridView" runat="server"
AutoGenerateColumns="false" ShowHeader="false" GridLines="None"
AlternatingRowStyle-BackColor="White" CssClass="StupidGridView" >
<EmptyDataTemplate>
<p class="italic">There are no attributes for this request.</p>
</EmptyDataTemplate>
<Columns>
<asp:TemplateField>
<ItemStyle CssClass="AttrTableCell" />
<ItemTemplate>
<asp:Label id="attributeName" runat="server"
Text='<%# Eval("Name") + ": "+ Eval("Value") %>'
CssClass="AttrGridCell"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</ItemTemplate>
</asp:TemplateField>
.StupidGridView {
width: 250px;
}

Themes are being applied and overriding control-level settings. Check theme settings on page, web.config, or anywhere else a theme may be set.

Unfortunately, the ASP.NET html rendering is really bad.
Microsoft know that and provided Control adapters in 2006 which allow you to modify control rendering.
Instead of searching on how to override what ASP.NET render, I would advise to use CSSFriendly which provides control adapters for most ASP.NET bad-rendered controls.
If you don't need "pure-css rendering" and CSS afraid you, you can check how they do to create your own adapter.
ScottGu post on this subject from google.