65.9K
CodeProject 正在变化。 阅读更多。
Home

ASP.NET GridView 中创建 HyperLinkField 的实用指南

Mr.Sourav.Maitra
starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.60/5 (5投票s)

2010年8月11日

Ms-PL

3分钟阅读

viewsIcon

86633

downloadIcon

1635

本文介绍了在 ASP.NET 的 GridView 中创建 HyperLinkField 的分步方法。

引言

有时，您可能需要在行中放置一个超链接。让我们看一个简单的例子；您有一个带有评论的最佳链接数据库。或者，例如，在一个数据库中有一些学生详细信息，包括照片和简历，您想向学院当局显示；简历和照片存储在服务器上。

在 ASP.NET 2.0 中，有一个名为 GridView 的控件。我想讨论一下 HyperLinkField，这是 Microsoft 提供的一个很棒的功能。

关于这个话题，网上有很多讨论和贡献，但我还没见过没有 SQLDataSource 控件的。

我喜欢使用三层架构，我的学生和企业客户也需要它。

在这里，我将分步介绍如何在 GridView 中创建 HyperLink 字段。

背景

期望您对三层架构有所了解并有过实践经验。除此之外，您至少已经创建过一个简单的 Web 应用程序。（显然，您知道基本的 C# 语法）。

让我们开始吧。

第一步：创建一个具有以下设计的表（像我一样懒吗？下载 SQL 脚本并生成表）。

列名 数据类型
UID varchar(50)
PhotoPath varchar(50)
UName varchar(50)
FilePath varchar(50)

表准备好了吗？很好。进入第二步。

第二步：使用 Visual Studio 2005/2008 打开一个新的 Web 应用程序模板

现在执行以下步骤...

  1. 从工具箱中拖放一个 GridView 控件。
  2. 点击智能标签，然后点击“编辑列”。
  3. “字段”对话框将弹出。
  4. 添加四个 BoundField（点击左侧窗格中的 BoundField，然后点击“添加”按钮）。
  5. 为每个 BoundField 设置“HeaderText”属性（从左下方的窗格中选择，然后在属性窗口中设置）。
  6. 现在点击每个 boundfield 上的“将此字段转换为模板列”链接。
  7. 不要忘记取消勾选“自动生成字段”。
  8. 现在，我们已经准备好了 GridView。是时候编辑模板了。首先点击智能标签，然后点击“编辑模板”以编辑所有创建的 4 个模板。
  9. 右键单击 Grid，然后点击“编辑模板”；会出现一个弹出菜单。点击 Column[3]-FilePath。
  10. 在“ItemTemplate”部分，会有一个 Label，删除它，然后从工具箱中放置一个 HyperLink 并命名。如果需要，您还可以设置其他属性。
  11. 点击 HyperLink 的智能标签；点击“编辑数据绑定”。
    1. 在 Text 属性上，我想显示文件路径；所以输入 Eval("FilePath");，这里的“FilePath”是数据库中的字段名。
    2. 同样，点击 NavigateURL 属性并输入相同的内容；因为我也想打开文件。
  12. 遵循相同的过程（右键单击 Grid -> 编辑模板 -> Column[2]-PhotoPath）来显示图像。我删除了默认的 Label 控件，然后从工具箱中放置了一个 Image 控件，然后在 ImageURL 属性中输入了 Eval("PhotoPath")。
  13. 现在，从 Gridview 的智能标签菜单中点击“结束模板编辑”，以恢复正常视图。
  14. 最后，是时候编写代码了。

我之前说过，我将使用三层架构……

首先，我的数据库访问层（DAL）中有以下代码。（所有代码都在 App_Code 文件夹中）。类名是 DB。

public DataTable FillAndReturnDataTable(string SelectQuery)
{
    SqlDataAdapter adp = new SqlDataAdapter(SelectQuery, GetConnection());
    DataTable dt = new DataTable();
    adp.Fill(dt);
    CloseConnection();
    return dt;
}

现在，将注意力集中在业务逻辑层（BLL）（位于 App_Code 文件夹下）。

我在 BLL 中添加了以下代码；类名是 bllRegistration。

DB dbObj = new DB();  
/// <summary>
/// Selects and Retrieves all Data from Profile Table
/// </summary>
/// <returns>A DataTable</returns>
public DataTable RetrieveProfile()
{
    DataSet ds = dbObj.FillAndReturnDataSet("Select * from Profile");
    return ds.Tables[0];    
}

我们几乎准备好了。最后，您可以将代码添加到您的用户界面（UI 层）。

您的 Page_Load 事件将包含以下内容：

protected void Page_Load(object sender, EventArgs e)
{
    FillMyGrid();
}

那么，UI 中的 FillMyGrid() 方法怎么样？

 public void FillMyGrid()  
   { 
        //I use Camel Case convention in UI layer.... 
        //This is my practice boss... 

         //Instantiate Object of BLL
        bllRegistration bllObject = new bllRegistration(); 

         //Fill a DataTable
        DataTable dtProfile = bllObject.RetrieveProfile(); 

        if (dtProfile.Rows.Count != 0)
        { 
            GridView1.DataSource = dtProfile;
            GridView1.DataBind(); 
        } 
  }

最终输出????

Output_HyperlinkField.jpg

历史

这是我的第一篇文章。所以，我对此感到非常高兴。如果您喜欢这篇文章以及带图片的 PDF，请在 http://www.souravmaitra.com 的“联系我们”页面上留言。

祝大家超链接字段使用愉快……

© . All rights reserved.