It is a frequent situation when a developer must include several field values in a hyperlink shown in CardView column cells. The best solution to this problem is to use templates. The attached example shows how this can be done and suggests two similar approaches:1) In a simple case, the href parameter of the <a> element is defined by the KeyValue of the processed card.2) In a complex case, the href parameter of the <a> element is defined in the server side GetCardValue method.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="DevExpress.Web.v15.1, Version=15.1.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" Namespace="DevExpress.Web" TagPrefix="dx" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>How to use a hyperlink whose argument depends on several cell values in the ASPxCardView</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<dx:ASPxCardView ID="ASPxCardView1" DataSourceID="AccessDataSource2" KeyFieldName="CategoryID" PreviewFieldName="Notes" AutoGenerateColumns="False" EnableCardsCache="False" ClientInstanceName="cardview" runat="server" Width="1000px">
<SettingsPager>
<SettingsTableLayout ColumnCount="2" RowsPerPage="2" />
</SettingsPager>
<SettingsBehavior AllowFocusedCard="True" ConfirmDelete="True" />
<Columns>
<dx:CardViewTextColumn FieldName="CategoryID" ReadOnly="True" VisibleIndex="0">
</dx:CardViewTextColumn>
<dx:CardViewTextColumn FieldName="CategoryName" VisibleIndex="1">
</dx:CardViewTextColumn>
<dx:CardViewTextColumn FieldName="Description" VisibleIndex="2">
</dx:CardViewTextColumn>
<dx:CardViewTextColumn Caption="Simple Hyperlink Column" VisibleIndex="3">
<DataItemTemplate>
<a id="clickElement" target="_blank" href="Default2.aspx?id=<%# Container.KeyValue%>"><%# "Show New Form, Key Field = " + Eval("CategoryID").ToString()%></a>
</DataItemTemplate>
</dx:CardViewTextColumn>
<dx:CardViewTextColumn Caption="Complex Hyperlink Column" VisibleIndex="4">
<DataItemTemplate>
<a id="A1" target="_blank" href="Default2.aspx?id=<%# GetCardValue(Container)%>"><%# "Show New Form, CategoryName = " + Eval("CategoryName").ToString()%></a>
</DataItemTemplate>
</dx:CardViewTextColumn>
</Columns>
</dx:ASPxCardView>
<asp:AccessDataSource ID="AccessDataSource2" runat="server" DataFile="~/App_Data/nwind.mdb"
SelectCommand="SELECT * FROM [Categories]">
</asp:AccessDataSource>
</div>
</form>
</body>
</html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using DevExpress.Web;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected string GetCardValue(CardViewDataItemTemplateContainer container)
{
return container.CardView.GetCardValuesByKeyValue(container.KeyValue, "CategoryName").ToString();
}
}
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
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"]);
}
}
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
</html>
<%@ Page Language="vb" AutoEventWireup="true" CodeFile="Default2.aspx.vb" Inherits="Default2" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
</html>
Imports System
Imports System.Collections.Generic
Imports System.Linq
Imports System.Web
Imports System.Web.UI
Imports System.Web.UI.WebControls
Imports DevExpress.Web
Partial Public Class _Default
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
End Sub
Protected Function GetCardValue(ByVal container As CardViewDataItemTemplateContainer) As String
Return container.CardView.GetCardValuesByKeyValue(container.KeyValue, "CategoryName").ToString()
End Function
End Class
<%@ Page Language="vb" AutoEventWireup="true" CodeFile="Default.aspx.vb" Inherits="_Default" %>
<%@ Register Assembly="DevExpress.Web.v15.1, Version=15.1.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" Namespace="DevExpress.Web" TagPrefix="dx" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>How to use a hyperlink whose argument depends on several cell values in the ASPxCardView</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<dx:ASPxCardView ID="ASPxCardView1" DataSourceID="AccessDataSource2" KeyFieldName="CategoryID" PreviewFieldName="Notes" AutoGenerateColumns="False" EnableCardsCache="False" ClientInstanceName="cardview" runat="server" Width="1000px">
<SettingsPager>
<SettingsTableLayout ColumnCount="2" RowsPerPage="2" />
</SettingsPager>
<SettingsBehavior AllowFocusedCard="True" ConfirmDelete="True" />
<Columns>
<dx:CardViewTextColumn FieldName="CategoryID" ReadOnly="True" VisibleIndex="0">
</dx:CardViewTextColumn>
<dx:CardViewTextColumn FieldName="CategoryName" VisibleIndex="1">
</dx:CardViewTextColumn>
<dx:CardViewTextColumn FieldName="Description" VisibleIndex="2">
</dx:CardViewTextColumn>
<dx:CardViewTextColumn Caption="Simple Hyperlink Column" VisibleIndex="3">
<DataItemTemplate>
<a id="clickElement" target="_blank" href="Default2.aspx?id=<%#Container.KeyValue%>"><%#"Show New Form, Key Field = " & Eval("CategoryID").ToString()%></a>
</DataItemTemplate>
</dx:CardViewTextColumn>
<dx:CardViewTextColumn Caption="Complex Hyperlink Column" VisibleIndex="4">
<DataItemTemplate>
<a id="A1" target="_blank" href="Default2.aspx?id=<%#GetCardValue(Container)%>"><%#"Show New Form, CategoryName = " & Eval("CategoryName").ToString()%></a>
</DataItemTemplate>
</dx:CardViewTextColumn>
</Columns>
</dx:ASPxCardView>
<asp:AccessDataSource ID="AccessDataSource2" runat="server" DataFile="~/App_Data/nwind.mdb"
SelectCommand="SELECT * FROM [Categories]">
</asp:AccessDataSource>
</div>
</form>
</body>
</html>
Imports System
Imports System.Collections.Generic
Imports System.Linq
Imports System.Web
Imports System.Web.UI
Imports System.Web.UI.WebControls
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"))
End If
End Sub
End Class