Solved

hyperlinks in gridview in asp.net

Posted on 2010-09-09
28
783 Views
Last Modified: 2012-05-10
I am working with a gridview control in asp.net and in that gridview I have last column as a hyperlink. what i want to do is when user clicks on the link I want the new page to show up on the same page and not another page. so how i want is when the user clicks on the link the grid should still be there on top of the page and then I can i have kind of a frame or something on bottom of the grid and upon click the new page shouuld open up in that frame and it should not redirect it to another page.
0
Comment
Question by:pratikshahse
  • 15
  • 7
  • 6
28 Comments
 
LVL 3

Expert Comment

by:ghayasurrehman
ID: 33640245
you should not use server control
use template column and add manual

<a href='link' target='_blank'>click here</a>
0
 
LVL 35

Expert Comment

by:YZlat
ID: 33640465
if you want the new page to show up in the same window and not another window, make sure you do not use target="_blank"
0
 
LVL 35

Expert Comment

by:YZlat
ID: 33640523
<asp:HyperLinkField DataNavigateUrlFields="ID"
 DataNavigateUrlFormatString="NewPage.aspx?id={0}"
                    DataTextField="YourField" NavigateUrl="NewPage.aspx" />
0
 
LVL 35

Expert Comment

by:YZlat
ID: 33640599
oh I see. You might have to do that from code behind and use iFrame to display another page
0
 
LVL 35

Expert Comment

by:YZlat
ID: 33640619
or you could Utilize AJAX and UpdatePanel. Are you using AJAX?
0
 

Author Comment

by:pratikshahse
ID: 33640656
no i am not using ajax
0
 
LVL 3

Expert Comment

by:ghayasurrehman
ID: 33640748
use datarowbound event


private void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
Hyperlink hl = (Hyperlink) e.Cell[<index of your column>].FindControl("hyperlink");
hl.Attributes.Add("onclick","window.open('url')");
hl.NavigateUrl = "#";
    }

Open in new window

0
 
LVL 35

Expert Comment

by:YZlat
ID: 33641172
If I understood you correctly, you will have a templatecolumn in your gridview with a hyperlink:

<asp:TemplateField HeaderText="Link">
    <ItemTemplate>
   
               <asp:HyperLink ID="Hyperlink1" runat="server" NavigateUrl="#" Text='<%#Eval("MyField") %>' />

    </ItemTemplate>
       </asp:TemplateField>

Then you will need to add an iFrame to your page:

<iframe id="myFrame" runat="server" width="500">
       
        </iframe>

And then you add the following to your code-behind file:

 public void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
    HtmlControl frame1 = (HtmlControl)this.FindControl("myFrame");

    if (e.Row.RowType == DataControlRowType.DataRow)
    {
       
            HyperLink hl = (HyperLink)e.Row.FindControl("HyperLink1");
     
        frame1.Attributes["src"]="NewPage.aspx?ID=" + DataBinder.Eval(e.Row.DataItem, "ID");
 
    }
}
0
 

Author Comment

by:pratikshahse
ID: 33645895
thanks all for the comments but in my case I am binding data to my grid from a datatable which is created on the fly from code behind.

my aspx code is something like this

    <asp:GridView ID="justification_grid" runat="server"
        AutoGenerateColumns="False" >
        <Columns>
            <asp:BoundField DataField="serviceid" HeaderText="Service" Visible=false />
            <asp:BoundField DataField="servicename" HeaderText="Service" />
            <asp:BoundField DataField="provider" HeaderText="Provider" />
            <asp:BoundField DataField="procedurecode" HeaderText="Procedure" />
            <asp:BoundField DataField="New" HeaderText="New" />
            <asp:BoundField DataField="Old_Amount" HeaderText="Old Budget" />
            <asp:BoundField DataField="New_Amount" HeaderText="New Budget" />
            <asp:BoundField DataField="Difference" HeaderText="Difference" />
            <asp:HyperLinkField Text="View" HeaderText="Notes/Attachments" DataNavigateUrlFields="serviceid" DataNavigateUrlFormatString="/apd/_controls/notes/notesdata.aspx?id={0}&ParentEntity=1" />
        </Columns>
    </asp:GridView>


the way i bind it to a grid is


                this.justification_grid.DataSource = GridTable.DefaultView;
                this.justification_grid.DataBind();


Gridtable is the datatable that i create on the fly.  how do i make  the link to open up in an iframe on the same page.
<asp:HyperLinkField Text="View" HeaderText="Notes/Attachments" DataNavigateUrlFields="serviceid" DataNavigateUrlFormatString="/apd/_controls/notes/notesdata.aspx?id={0}&ParentEntity=1" />





0
 

Author Comment

by:pratikshahse
ID: 33646337
ok i was able to get to the rowdatabound and mygrid_RowDataBound(object sender, GridViewRowEventArgs e)
but since i cannot have an id or name for my hyperlinkcolumn in the gridview how do i resolve this statement

  HyperLink hl = (HyperLink)e.Row.FindControl("HyperLink1");

for me .FindControl is not going to work i am not able to give an id or name to my hyperlink column in my gridview

0
 
LVL 3

Expert Comment

by:ghayasurrehman
ID: 33646668
the name is not for the column, this is the name of the hyperlink contorl you have added in the grid
0
 
LVL 3

Expert Comment

by:ghayasurrehman
ID: 33646726
use the following code
protected void justification_grid_RowDataBound(object sender, GridViewRowEventArgs e)

    {

        ((HyperLink)e.Row.Cells[7].FindControl("Hyperlink1")).Attributes.Add("target", "_blank");

    }







<asp:GridView ID="justification_grid" runat="server" 

        AutoGenerateColumns="False" onrowdatabound="justification_grid_RowDataBound" >

        <Columns>

            <asp:BoundField DataField="serviceid" HeaderText="Service" Visible=false />

            <asp:BoundField DataField="servicename" HeaderText="Service" />

            <asp:BoundField DataField="provider" HeaderText="Provider" />

            <asp:BoundField DataField="procedurecode" HeaderText="Procedure" />

            <asp:BoundField DataField="New" HeaderText="New" />

            <asp:BoundField DataField="Old_Amount" HeaderText="Old Budget" />

            <asp:BoundField DataField="New_Amount" HeaderText="New Budget" />

            <asp:BoundField DataField="Difference" HeaderText="Difference" />

            <asp:TemplateField HeaderText="Notes/Attachments">

                <ItemTemplate>

                    <asp:HyperLink ID="HyperLink1" runat="server"                     

                        NavigateUrl='<%# Eval("serviceid", "/apd/_controls/notes/notesdata.aspx?id={0}&ParentEntity=1") %>' 

                        Text="View"></asp:HyperLink>

                </ItemTemplate>

            </asp:TemplateField>

        </Columns>

    </asp:GridView>

Open in new window

0
 
LVL 35

Expert Comment

by:YZlat
ID: 33646764
you will have to use TemplateColumn as I showed you in my example instead of  <asp:HyperLinkField Text="View" HeaderText="Notes/Attachments" DataNavigateUrlFields="serviceid" DataNavigateUrlFormatString="/apd/_controls/notes/notesdata.aspx?id={0}&ParentEntity=1" />
0
 
LVL 35

Expert Comment

by:YZlat
ID: 33646770
otherwise you won't be able to use my code
0
How to improve team productivity

Quip adds documents, spreadsheets, and tasklists to your Slack experience
- Elevate ideas to Quip docs
- Share Quip docs in Slack
- Get notified of changes to your docs
- Available on iOS/Android/Desktop/Web
- Online/Offline

 
LVL 35

Expert Comment

by:YZlat
ID: 33646802
There is another way, you can reference the column through control index but it's not recommended. I'd strongly recommend using TemplateField
0
 
LVL 3

Expert Comment

by:ghayasurrehman
ID: 33646808
change the index from 7 to 8 in server side code
protected void justification_grid_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        ((HyperLink)e.Row.Cells[8].FindControl("Hyperlink1")).Attributes.Add("target", "_blank");
    }

Open in new window

0
 
LVL 35

Expert Comment

by:YZlat
ID: 33646911
<asp:GridView ID="justification_grid" runat="server"
        AutoGenerateColumns="False" >
        <Columns>
            <asp:BoundField DataField="serviceid" HeaderText="Service" Visible=false />
            <asp:BoundField DataField="servicename" HeaderText="Service" />
            <asp:BoundField DataField="provider" HeaderText="Provider" />
            <asp:BoundField DataField="procedurecode" HeaderText="Procedure" />
            <asp:BoundField DataField="New" HeaderText="New" />
            <asp:BoundField DataField="Old_Amount" HeaderText="Old Budget" />
            <asp:BoundField DataField="New_Amount" HeaderText="New Budget" />
            <asp:BoundField DataField="Difference" HeaderText="Difference" />
<asp:TemplateField HeaderText="Notes/Atatchments">
               <ItemTemplate>
   
               <asp:HyperLink ID="Hyperlink1" runat="server" NavigateUrl="#" Text='<%#Eval("servicename") %>' />

    </ItemTemplate>
       </asp:TemplateField>
                    </Columns>
    </asp:GridView>

0
 

Author Comment

by:pratikshahse
ID: 33648719
when i click on "View" it still tries to open a page on another page. i want it to open in the iframe on the same page.
0
 
LVL 35

Expert Comment

by:YZlat
ID: 33648766
can you post your code?

it does that because you need to set DataNavigateUrlFormatString to nothing:

DataNavigateUrlFormatString="#"
or NavigateUrl="#"

0
 
LVL 35

Expert Comment

by:YZlat
ID: 33648775
if you used my suggestion it would open it inside the iframe. My code worked for me
0
 
LVL 3

Expert Comment

by:ghayasurrehman
ID: 33648797
now use this and remove the server side code
<script language="javascript" type="text/javascript">
        function openFrame(url) {

            document.getElementById('iframeId').src = url;
        }
    </script>
    
     <asp:GridView ID="justification_grid" runat="server" 
        AutoGenerateColumns="False" onrowdatabound="justification_grid_RowDataBound" >
        <Columns>
            <asp:BoundField DataField="serviceid" HeaderText="Service" Visible=false />
            <asp:BoundField DataField="servicename" HeaderText="Service" />
            <asp:BoundField DataField="provider" HeaderText="Provider" />
            <asp:BoundField DataField="procedurecode" HeaderText="Procedure" />
            <asp:BoundField DataField="New" HeaderText="New" />
            <asp:BoundField DataField="Old_Amount" HeaderText="Old Budget" />
            <asp:BoundField DataField="New_Amount" HeaderText="New Budget" />
            <asp:BoundField DataField="Difference" HeaderText="Difference" />
            <asp:TemplateField HeaderText="Notes/Attachments">
                <ItemTemplate>
                    <asp:HyperLink ID="HyperLink1" runat="server"                     
                        NavigateUrl='javascript:openFrame("<%# Eval("serviceid", "/apd/_controls/notes/notesdata.aspx?id={0}&ParentEntity=1") %>");' 
                        Text="View"></asp:HyperLink>
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
    </asp:GridView>

Open in new window

0
 

Author Comment

by:pratikshahse
ID: 33649611
ghayasurrehman :

i am trying to use your above code sample and it gives me a javascript error saying expect '('

i thiink you are very close just one issue and it should be solved. please help me out.



YZlat: I tried using yours too but it gives me web page of the last link in the my grid view. and when i click on other links nothing happens.

Here is my code :

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="justification.aspx.cs" Inherits="justification" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml">
<script language="javascript" type="text/javascript">
    function openFrame(url) {

        document.getElementById('justificationframe').src = url;
    }
    </script>


<head runat="server">
    <title></title>
    <link rel="stylesheet" type="text/css" href="template.css" />
</head>
<body>
    <form id="form1" runat="server">
    <div>
   
    </div>

<asp:GridView ID="justificationGrid" runat="server"
        AutoGenerateColumns="False"  >
        <Columns>
            <asp:BoundField DataField="serviceid" HeaderText="Service" Visible=false />
            <asp:BoundField DataField="servicename" HeaderText="Service" />
            <asp:BoundField DataField="provider" HeaderText="Provider" />
            <asp:BoundField DataField="procedurecode" HeaderText="Procedure" />
            <asp:BoundField DataField="New" HeaderText="New" />
            <asp:BoundField DataField="Old_Amount" HeaderText="Old Budget" />
            <asp:BoundField DataField="New_Amount" HeaderText="New Budget" />
            <asp:BoundField DataField="Difference" HeaderText="Difference" />
            <asp:TemplateField HeaderText="Notes/Attachments">
                <ItemTemplate>
                    <asp:HyperLink ID="HyperLink1" runat="server"                    
                        NavigateUrl='javascript:openFrame("<%# Eval("serviceid", "/apd/_controls/notes/notesdata.aspx?id={0}&ParentEntity=1") %>");'
                        Text="View"></asp:HyperLink>
                </ItemTemplate>
            </asp:TemplateField>

        </Columns>
    </asp:GridView>

    <%--            <asp:HyperLinkField Text="View" HeaderText="Notes/Attachments" DataNavigateUrlFields="serviceid" DataNavigateUrlFormatString="/apd/_controls/notes/notesdata.aspx?id={0}&ParentEntity=1" />
--%>    
    <iframe id="justificationframe" runat="server" width="500" visible="true" ></iframe>

    </form>
</body>
</html>


0
 
LVL 35

Expert Comment

by:YZlat
ID: 33650318
change your page to this:



<%@ Page Language="C#" AutoEventWireup="true" CodeFile="justification.aspx.cs" Inherits="justification" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">
    <title></title>
    <link rel="stylesheet" type="text/css" href="template.css" />
</head>
<body>
    <form id="form1" runat="server">
    <div>
   
    </div>

<asp:GridView ID="justificationGrid" runat="server"
        AutoGenerateColumns="False"  >
        <Columns>
            <asp:BoundField DataField="serviceid" HeaderText="Service" Visible=false />
            <asp:BoundField DataField="servicename" HeaderText="Service" />
            <asp:BoundField DataField="provider" HeaderText="Provider" />
            <asp:BoundField DataField="procedurecode" HeaderText="Procedure" />
            <asp:BoundField DataField="New" HeaderText="New" />
            <asp:BoundField DataField="Old_Amount" HeaderText="Old Budget" />
            <asp:BoundField DataField="New_Amount" HeaderText="New Budget" />
            <asp:BoundField DataField="Difference" HeaderText="Difference" />
<asp:TemplateField HeaderText="Notes/Atatchments">
               <ItemTemplate>
   
               <asp:HyperLink ID="Hyperlink1" runat="server" NavigateUrl="#" Text='View' />

    </ItemTemplate>
       </asp:TemplateField>

         

        </Columns>
    </asp:GridView>

   
    <iframe id="justificationframe" runat="server" width="500" visible="true" ></iframe>

    </form>
</body>
</html>


and then add the following in your code-behind file:



public void justificationGrid_RowDataBound(object sender, GridViewRowEventArgs e)
{
    HtmlControl frame1 = (HtmlControl)this.FindControl("justificationframe");

    if (e.Row.RowType == DataControlRowType.DataRow)
    {
       
            HyperLink hl = (HyperLink)e.Row.FindControl("HyperLink1");
     
        frame1.Attributes["src"]="="/apd/_controls/notes/notesdata.aspx?id=" + DataBinder.Eval(e.Row.DataItem, "serviceid");
 
    }
}


and add this to your Page_Load event:

this.justificationGrid.RowDataBound += new EventHandler(justificationGrid_RowDataBound);.
0
 

Author Comment

by:pratikshahse
ID: 33683726
YZlat,

thanks for the code but your code still puts the last link in the iframe when the page is loaded. and on clicking other "View" links it does not do anything. What I want is on pageload the iframe should be empty and on clicking the links the iframe should be populated.

also the page load code is erroring as its asking for parameters to be passed

and add this to your Page_Load event:

this.justificationGrid.RowDataBound += new EventHandler(justificationGrid_RowDataBound);.


any other suggestions. i really appreciate your time in this matter.
0
 
LVL 35

Expert Comment

by:YZlat
ID: 33700748
0
 
LVL 35

Accepted Solution

by:
YZlat earned 500 total points
ID: 33701426
try this:

<asp:GridView ID="justificationGrid" runat="server"
        AutoGenerateColumns="False"  >
        <Columns>
            <asp:BoundField DataField="serviceid" HeaderText="Service" Visible=false />
            <asp:BoundField DataField="servicename" HeaderText="Service" />
            <asp:BoundField DataField="provider" HeaderText="Provider" />
            <asp:BoundField DataField="procedurecode" HeaderText="Procedure" />
            <asp:BoundField DataField="New" HeaderText="New" />
            <asp:BoundField DataField="Old_Amount" HeaderText="Old Budget" />
            <asp:BoundField DataField="New_Amount" HeaderText="New Budget" />
            <asp:BoundField DataField="Difference" HeaderText="Difference" />
            <asp:HyperLinkField HeaderText="Notes/Attachments"
    DataTextField="serviceid"
    DataTextFormatString="View"
    DataNavigateUrlFields="serviceid"
    DataNavigateUrlFormatString="/apd/_controls/notes/notesdata.aspx?id={0}&ParentEntity=1"
    Target="justificationframe" />


 
        </Columns>
    </asp:GridView>


    <iframe id="justificationframe" name="justificationframe" runat="server" width="500" visible="true" ></iframe>

The key is specifying the Target attribute of HyperLinkField as your iframe name and setting both id and name attributes of an iframe to frame's name
0
 
LVL 35

Expert Comment

by:YZlat
ID: 33716546
Did it work for you?
0
 

Author Closing Comment

by:pratikshahse
ID: 33718613
YZlat,

Thanks a lot for all your help.
0

Featured Post

6 Surprising Benefits of Threat Intelligence

All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

Join & Write a Comment

A quick way to get a menu to work on our website, is using the Menu control and assign it to a web.sitemap using SiteMapDataSource. Example of web.sitemap file: (CODE) Sample code to add to the page menu: (CODE) Running the application, we wi…
This article is for Object-Oriented Programming (OOP) beginners. An Interface contains declarations of events, indexers, methods and/or properties. Any class which implements the Interface should provide the concrete implementation for each Inter…
This demo shows you how to set up the containerized NetScaler CPX with NetScaler Management and Analytics System in a non-routable Mesos/Marathon environment for use with Micro-Services applications.
Polish reports in Access so they look terrific. Take yourself to another level. Equations, Back Color, Alternate Back Color. Write easy VBA Code. Tighten space to use less pages. Launch report from a menu, considering criteria only when it is filled…

743 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

15 Experts available now in Live!

Get 1:1 Help Now