« Put a face to that email | Main | Spanish Language Pack for DotNetNuke (DNN) »

April 06, 2006

GridView, HyperLinkField, and JavaScript: what the #%$@!

My blog has moved. Please go to: http://jstawski.com/archive/2006/04/06/GridView_2C00_-HyperLinkField_2C00_-and-JavaScript_3A00_-what-the-_23002500240040002100_.aspx

When you always think something is going to go very smooth you know there will be something to make it rough. Of course I'm talking about code. As the title might have given it away, I'm talking about the GridView. To be more specific: a GridView with a HyperLinkField and JavaScript.
In 2005, a HyperlinkField cannot have javascript. For some reason if you do something like this:

<asp:HyperLinkField HeaderText="PLAN IMG" DataTextField="PLAN_IMG" Text="{0}" SortExpression="PLAN_IMG" DataNavigateUrlFields="PLAN_IMG" DataNavigateUrlFormatString="javascript:MM_openBrWindow('../images/elevations/{0}','img','');"/>

The grid will be rendered without a hyperlink. How to solve this problem, you may ask. After reading this blog I came up with a solution. Use a BoundField with a dataformatstring of an anchor.

<asp:BoundField DataFormatString="<a href=javascript:MM_openBrWindow('../images/elevations/{0}','img','');>{0}</a>" DataField="PLAN_IMG" HeaderText="PLAN_IMG" SortExpression="PLAN_IMG" />

Please note that I don't have any spaces in the href=. Hope this helps you guys.

Happy Programming!

02:51 PM | Permalink


I used this solution and it works, but I get a weird situation in that when the child page pops up (correctly), the parent page blanks out with only text being "[object]". If I refresh the parent page, the text changes to "null".

any help would be greatly appreciated.

Posted by: Chris | Apr 24, 2006 9:49:48 AM

Did you add the javascript in front of the href? Please add the code here so that everyone can see it.

Posted by: Jonas | Apr 28, 2006 12:45:07 PM

You are now promoted to my personal hero! :-)
It works perfect. I used it in code behind with VB.

Posted by: wim | May 18, 2006 5:07:19 AM

Hmmm, just 1 problem, it works fine with firefox but it does nothing at all in IE. :s

Posted by: wim | May 23, 2006 5:28:19 AM

I have facing the same problem here.I am also getting the problem of(when the child page pops up (correctly), the parent page blanks out with only text being "[object]". ).
I have used javascript in href also.
I have one more problem
I want to pass a value as we pass in the hyperlink field using datanavigationfields.
Please help me.

Posted by: shirish | Jun 30, 2006 11:12:52 AM

Thanks to all.I have found the solutions of hyperlink problem in gridview.
I tried many solutions but nothing was working.One solution is change the hyperlink column into the template column.If you dont know the syntex of template column then just go into the design view.check the smart tag of the gridview.Where you can find a link "change this column into template column" just click that and it seems that hyperlink field is working.

Posted by: shirish | Jul 8, 2006 10:37:21 AM

Shirish, please post your code here so everyone else can see it.

Posted by: Jonas | Jul 13, 2006 11:27:02 AM

Wim, that might be a problem with your JavaScript. Usually JavaScript works very differently between browsers. I suggest you set the JavaScript into a function and test it without the GridView. Make sure it works well on all your supported browsers and once it works move forward to use it on the GridView

Posted by: Jonas | Jul 13, 2006 11:29:32 AM

To solve this problem, you could also derived from the HyperLinkField class and override the FormatDataNavigateUrlValue method. Once you only need to affect the NavigateUrl property with the result of the base class.... Enjoy

internal sealed class HyperLinkField : System.Web.UI.WebControls.HyperLinkField
protected override string FormatDataNavigateUrlValue(object[] dataUrlValues)
return NavigateUrl = base.FormatDataNavigateUrlValue(dataUrlValues);

Posted by: RedFox | Aug 19, 2006 9:50:50 AM

Dear Joans,
I am sorry,I didnt visit your blog.so didnt read th reply.Actually there is no code require for that.Just convert the hyperlink field in the templatefield(from the design view).
The hyperlinkfield will be the same as we do in datagrid.
if you require what i did exactly then plz inform me .i will post it here.

Posted by: shirish | Aug 25, 2006 1:53:02 AM

My issue is in regards to making a whole row in a gridview linkable... not just the data itself. Also, if possible, having the cursor change when scrolling over each row.

Posted by: Kevin | Sep 6, 2006 4:41:21 PM

Nice ;p
However, any tricks to make it works when you have spaces in your {0} expression ?

Posted by: valk | Sep 12, 2006 12:25:36 PM

[OBJECT] window.
wrap your javascript call in a void()
I was running into the object problem with the hyperlink in the DataGrid, so now instead of
window.open() I'm using void(window.open())

for the case that window.open() works in FireFox but now IE, be sure that your window name doesn't have any spaces.

window.open('http://mysite.com','my Window Name')

Posted by: matt | Sep 29, 2006 12:11:33 PM

Hello guys,
I have tried doing both of these javascript:void but I am not able to see the output as I want... soemtimes a smal window pops up but the tool bar are there even though I have disabled them.
Can anybody post the perfect code for this.
Thanks...i would really be greatful!

Posted by: T | Oct 2, 2006 3:51:05 PM

Please look at this post for more control over the columns

Posted by: Jonas | Oct 5, 2006 2:22:07 PM

Thank you so much

Posted by: Golfy | Oct 19, 2006 9:45:48 PM

This works fine, but I am lost when it comes to using more then one dynamic value in the Bound Field. How dare Microsoft mess this up especially after all the short comings in ASP.NET 1.1

Posted by: Macro | Jan 10, 2007 6:49:17 PM

Thanks for your article

"GridView, HyperLinkField, and JavaScript: what the #%$@!"

you solve my problem and made my wondering if Microsoft do this things intentionally or yes THEY'RE STUPIDS!!!!

Live VERY Long and Prosper... :)

Posted by: Gabriel Prieto | Mar 27, 2007 7:19:14 PM

I got it working like this:

but I'm having trouble getting it to pass the parameter {0}.

Any suggestions?


Posted by: DaveyP | Apr 4, 2007 11:06:18 AM

Sorry. Text didn't come out.

Navigateurl is :


As I say, the window opens fine, but it doesn't pass the parameter

Posted by: DaveyP | Apr 4, 2007 11:17:12 AM

I changed blogs and I'm not maintaining this one any longer. Please post your question here: http://jstawski.com/archive/2006/04/06/GridView_2C00_-HyperLinkField_2C00_-and-JavaScript_3A00_-what-the-_23002500240040002100_.aspx

Posted by: Jonas | Apr 4, 2007 12:53:46 PM

You are awesome :) it works, Thanks buddy

Posted by: asif | Aug 22, 2007 4:59:55 AM

thanks for your sharing.sir!
so i share u some useful websites too.

http://www.buywowgold.org.cn wow gold|buy wow gold
http://www.buy-wow-gold.org.cn wow gold|buy wow gold

Posted by: cool dog | Oct 10, 2007 12:03:30 PM

thanks for your sharing.sir!
so i share u some useful websites too.

http://www.buywowgold.org.cn wow gold|buy wow gold
http://www.buy-wow-gold.org.cn wow gold|buy wow gold
http://ggtop.nbatop.com google排名|google左侧排名
http://www.nbatop.com nba live|nba live 2008

Posted by: cool dog | Oct 21, 2007 8:55:01 AM

Thank a lot !

Posted by: vishwanath | Apr 15, 2008 3:29:31 PM

The comments to this entry are closed.