C1GridView 支持丰富的单元格类型,同时,也可以根据用户需求自定义单元格类型。在本篇文章中,我们将讨论如何绑定 C1HyperLinkFiled 到 C1GridView,在表格中添加超链接。

在本文的实例中,C1GridView 的数据源为 Table Categories 。实现 C1HyperLinkField 需要设置一下属性:

1.CategoryName 字段指定给 C1HyperLinkField 下 DateTextField 属性。

2.URL 字段指定给 DataNavigateUrlFields 属性。

3.点击 C1HyperLinkField 下 hyperlinked 文本,页面将转换到“DataNavigateUrlFormatString” 属性对应的 URL 地址。

以下代码实现 C1GridView 添加 C1HyperLinkField。在这里 ItemStyle 属性用于设置hyperlinked 文本的前景色为蓝色。通过该属性还可以设置更多的样式。

<wijmo:C1HyperLinkField HeaderText="CategoryName" DataTextField="CategoryName"
            DataNavigateUrlFields="CategoryID,CategoryName"
            DataNavigateUrlFormatString="~/Default2.aspx?CategoryID={0}&CategoryName={1}"
            Target="_self">
            <ItemStyle ForeColor="Blue" />
 </wijmo:C1HyperLinkField>

下面为当前效果截图:

可以结合 CategoryID CategoryName 作为查询字符串,点击任意 hyperlink  导航当前页面到链接中页面。

 

string categoryID=Request.QueryString["CategoryID"];
string categoryName=Request.QueryString["CategoryName"];

假设,你需要显示当前点击的产品信息,可以通过以上两条查询语句实现,实现效果如下:

以上就实现了本文提到的主要功能,下面我们将定制超链接的样式,改善外观:

通常来说 HyperLink 为蓝色。但是,Wijmo C1GridView 的 CSS 样式覆盖了 HyperLink 的颜色。更方法如下,添加以下样式到当前页面:

<style type="text/css">
         .ui-widget.wijmo-wijgrid .ui-widget-content a
         {
             color: inherit;
         }
 </style>

好了,目前为止,我们就实现了向 C1GridVIew 中添加超链接的功能。:)