How to: Use a Hyperlink Whose Argument Depends on Several Cell Values in the ASPxGridView

Oct 05, 2021
4 minutes to read

The example below suggests two similar techniques to implementing hyperlinks, whose properties depend on several cell values:

in a “simple” case, the href parameter of the a element is defined by the KeyValue of the processed row.
in a “complex” case, the href parameter of the a element is defined in the server side GetRowValue method.

View Example

Default.aspx.cs
Default2.aspx (C#)
MasterPage.master.cs
Default.aspx (C#)
Default2.aspx.cs
Default.aspx (VB.NET)
Default.aspx.vb
Default2.aspx.vb
MasterPage.master.vb
Default2.aspx (VB.NET)

csharp

using System;
using System.Data;
using System.Configuration;
using System.Collections.Generic;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using DevExpress.Web;
using System.IO;
using System.Drawing;
using System.Drawing.Imaging;
using DevExpress.Web.ASPxGridView;
using DevExpress.Web.ASPxEditors;

public partial class _Default : System.Web.UI.Page
{

    protected string GetRowValue(GridViewDataItemTemplateContainer container) {
        return container.Grid.GetRowValuesByKeyValue(container.KeyValue, "CategoryName").ToString();
    }

    protected void keyFieldLink_Init(object sender, EventArgs e) {
        ASPxHyperLink link = sender as ASPxHyperLink;
        GridViewDataItemTemplateContainer container = link.NamingContainer as GridViewDataItemTemplateContainer;
        link.Text = "Show New Form, Key Field = " + container.KeyValue;
        link.Target = "_blank";
        link.NavigateUrl = "Default2.aspx?id=" + container.KeyValue;
    }
}

aspx

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

<!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>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>

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

csharp

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class MasterPage : System.Web.UI.MasterPage
{
    protected void Page_Load(object sender, EventArgs e) {

    }
}

aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" MasterPageFile="~/MasterPage.master"%>

<%@ Register Assembly="DevExpress.Web.v13.1, Version=13.1.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
    Namespace="DevExpress.Web.ASPxGridView" TagPrefix="dxwgv" %>

<%@ Register Assembly="DevExpress.Web.v13.1, Version=13.1.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
    Namespace="DevExpress.Web.ASPxEditors" TagPrefix="dxe" %>

<asp:Content ContentPlaceHolderID="ContentPlaceHolder1" ID="CC" runat="Server">
    <dxwgv:ASPxGridView ID="grid" ClientInstanceName="grid" runat="server" DataSourceID="AccessDataSource2" KeyFieldName="CategoryID" PreviewFieldName="Notes" AutoGenerateColumns="False" EnableRowsCache="False">
        <Columns>
            <dxwgv:GridViewDataTextColumn FieldName="CategoryID" ReadOnly="True">
                <EditFormSettings Visible="False" />
            </dxwgv:GridViewDataTextColumn>
            <dxwgv:GridViewDataTextColumn FieldName="CategoryName">
            </dxwgv:GridViewDataTextColumn>
            <dxwgv:GridViewDataTextColumn FieldName="Description">
            </dxwgv:GridViewDataTextColumn>
            <dxwgv:GridViewDataTextColumn Caption="ASPxHyperlink in DataItemTemplate">
                <DataItemTemplate>
                    <dxe:ASPxHyperLink runat="server" ID="keyFieldLink" OnInit="keyFieldLink_Init"></dxe:ASPxHyperLink>
                </DataItemTemplate>
            </dxwgv:GridViewDataTextColumn>
            <dxwgv:GridViewDataTextColumn Caption="The 'a' tag in DataItemTemplate">
                <DataItemTemplate>
                    <a id="clickElement" target="_blank" href="Default2.aspx?category=<%# GetRowValue(Container)%>"><%# "Show New Form, CategoryName = " + Eval("CategoryName").ToString()%></a>
                </DataItemTemplate>
            </dxwgv:GridViewDataTextColumn>
        </Columns>
    </dxwgv:ASPxGridView>
        <asp:AccessDataSource ID="AccessDataSource2" runat="server" DataFile="~/App_Data/nwind.mdb"
        SelectCommand="SELECT * FROM [Categories]">
    </asp:AccessDataSource>
</asp:Content>

csharp

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class Default2 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e) {
        if(!string.IsNullOrEmpty(Request.QueryString["id"]))
            Response.Write("ID = " + Request.QueryString["id"]);
        else if (!string.IsNullOrEmpty(Request.QueryString["category"]))
            Response.Write("Category = " + Request.QueryString["category"]);
    }
}

aspx

<%@ Page Language="vb" AutoEventWireup="true" CodeFile="Default.aspx.vb" Inherits="_Default" MasterPageFile="~/MasterPage.master"%>

<%@ Register Assembly="DevExpress.Web.v13.1, Version=13.1.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
    Namespace="DevExpress.Web.ASPxGridView" TagPrefix="dxwgv" %>

<%@ Register Assembly="DevExpress.Web.v13.1, Version=13.1.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
    Namespace="DevExpress.Web.ASPxEditors" TagPrefix="dxe" %>

<asp:Content ContentPlaceHolderID="ContentPlaceHolder1" ID="CC" runat="Server">
    <dxwgv:ASPxGridView ID="grid" ClientInstanceName="grid" runat="server" DataSourceID="AccessDataSource2" KeyFieldName="CategoryID" PreviewFieldName="Notes" AutoGenerateColumns="False" EnableRowsCache="False">
        <Columns>
            <dxwgv:GridViewDataTextColumn FieldName="CategoryID" ReadOnly="True">
                <EditFormSettings Visible="False" />
            </dxwgv:GridViewDataTextColumn>
            <dxwgv:GridViewDataTextColumn FieldName="CategoryName">
            </dxwgv:GridViewDataTextColumn>
            <dxwgv:GridViewDataTextColumn FieldName="Description">
            </dxwgv:GridViewDataTextColumn>
            <dxwgv:GridViewDataTextColumn Caption="ASPxHyperlink in DataItemTemplate">
                <DataItemTemplate>
                    <dxe:ASPxHyperLink runat="server" ID="keyFieldLink" OnInit="keyFieldLink_Init"></dxe:ASPxHyperLink>
                </DataItemTemplate>
            </dxwgv:GridViewDataTextColumn>
            <dxwgv:GridViewDataTextColumn Caption="The 'a' tag in DataItemTemplate">
                <DataItemTemplate>
                    <a id="clickElement" target="_blank" href="Default2.aspx?category=<%#GetRowValue(Container)%>"><%#"Show New Form, CategoryName = " & Eval("CategoryName").ToString()%></a>
                </DataItemTemplate>
            </dxwgv:GridViewDataTextColumn>
        </Columns>
    </dxwgv:ASPxGridView>
        <asp:AccessDataSource ID="AccessDataSource2" runat="server" DataFile="~/App_Data/nwind.mdb"
        SelectCommand="SELECT * FROM [Categories]">
    </asp:AccessDataSource>
</asp:Content>

Imports System
Imports System.Data
Imports System.Configuration
Imports System.Collections.Generic
Imports System.Web
Imports System.Web.Security
Imports System.Web.UI
Imports System.Web.UI.WebControls
Imports System.Web.UI.WebControls.WebParts
Imports System.Web.UI.HtmlControls
Imports DevExpress.Web
Imports System.IO
Imports System.Drawing
Imports System.Drawing.Imaging
Imports DevExpress.Web.ASPxGridView
Imports DevExpress.Web.ASPxEditors

Partial Public Class _Default
    Inherits System.Web.UI.Page

    Protected Function GetRowValue(ByVal container As GridViewDataItemTemplateContainer) As String
        Return container.Grid.GetRowValuesByKeyValue(container.KeyValue, "CategoryName").ToString()
    End Function

    Protected Sub keyFieldLink_Init(ByVal sender As Object, ByVal e As EventArgs)
        Dim link As ASPxHyperLink = TryCast(sender, ASPxHyperLink)
        Dim container As GridViewDataItemTemplateContainer = TryCast(link.NamingContainer, GridViewDataItemTemplateContainer)
        link.Text = "Show New Form, Key Field = " & container.KeyValue
        link.Target = "_blank"
        link.NavigateUrl = "Default2.aspx?id=" & container.KeyValue
    End Sub
End Class

Imports System
Imports System.Data
Imports System.Configuration
Imports System.Collections
Imports System.Web
Imports System.Web.Security
Imports System.Web.UI
Imports System.Web.UI.WebControls
Imports System.Web.UI.WebControls.WebParts
Imports System.Web.UI.HtmlControls

Partial Public Class Default2
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
        If Not String.IsNullOrEmpty(Request.QueryString("id")) Then
            Response.Write("ID = " & Request.QueryString("id"))
        ElseIf Not String.IsNullOrEmpty(Request.QueryString("category")) Then
            Response.Write("Category = " & Request.QueryString("category"))
        End If
    End Sub
End Class

Imports System
Imports System.Data
Imports System.Configuration
Imports System.Collections
Imports System.Web
Imports System.Web.Security
Imports System.Web.UI
Imports System.Web.UI.WebControls
Imports System.Web.UI.WebControls.WebParts
Imports System.Web.UI.HtmlControls

Partial Public Class MasterPage
    Inherits System.Web.UI.MasterPage

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)

    End Sub
End Class

aspx

<%@ Page Language="vb" AutoEventWireup="true" CodeFile="Default2.aspx.vb" Inherits="Default2" %>

<!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>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>

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