科技行者

行者学院 转型私董会 科技行者专题报道 网红大战科技行者

知识库

知识库 安全导航

至顶网软件频道基础软件ASP.NET 2.0打造购物车和支付系统之二

ASP.NET 2.0打造购物车和支付系统之二

  • 扫一扫
    分享文章到微信

  • 扫一扫
    关注官方公众号
    至顶头条

在本篇中,我们将经由一个简单的网上商店演示程序来探讨GridView

作者:朱先忠编译 来源:天极开发 2007年11月6日

关键字: ASP.NET 购物车 支付系统 Windows

  • 评论
  • 分享微博
  • 分享邮件
在本篇中,我们将经由一个简单的网上商店演示程序来探讨GridView,并开始分析一种生成GridView的DataSource的方法,然后继续使用该数据来创建一个完全功能的购物接口。注意,在这个演示程序中的DataSource是可以自由创建的。

  一、 简介

  在第一篇中,我们讨论了什么是GridView以及如何使用它,包括实际数据如何绑定到其上。在本文中,我们将更密切地分析这些数据的来源以及如何与GridView一起使用它来实现一个简单的购物接口。

  二、 数据来自于何处?

  从根本上讲,这个问题要依赖于你要干什么。它可以来自于一个静态XML文件,一个动态的XML馈送,一个数据库,或许它是自由创建的。但是,无论如何,应该确保满足:如果存在数据,你能够确保它能够"导入"到一个GridView中。在本文中,在每次重启动应用程序时,这部分数据都是自由创建的。

  用于填充两个GridView的DataSource是一个DataTable。它是使用DataColumns和DataRows构建的。在这个主类文件内存在一个称为"createProductDT"的函数,它说明了DataTable的初始创建方式。下面是该函数的完整实现:

private DataTable createProductDT()
{
 DataTable dtProducts = new DataTable();
 DataColumn productColumn = new DataColumn();
 productColumn.DataType = System.Type.GetType("System.Int32");
 productColumn.ColumnName = "id";
 productColumn.Unique = true;
 dtProducts.Columns.Add(productColumn);
 productColumn = new DataColumn();
 productColumn.DataType = System.Type.GetType("System.String");
 productColumn.ColumnName = "thumb";
 dtProducts.Columns.Add(productColumn);
 productColumn = new DataColumn();
 productColumn.DataType = System.Type.GetType("System.String");
 productColumn.ColumnName = "name";
 dtProducts.Columns.Add(productColumn);
 productColumn = new DataColumn();
 productColumn.DataType = System.Type.GetType("System.Double");
 productColumn.ColumnName = "price";
 dtProducts.Columns.Add(productColumn);
 productColumn = new DataColumn();
 productColumn.DataType = System.Type.GetType("System.Int32");
 productColumn.ColumnName = "quantity";
 dtProducts.Columns.Add(productColumn);

 //使"id"成为主键
 DataColumn[] pkColumns = new DataColumn[1];
 pkColumns[0] = dtProducts.Columns["id"];
 dtProducts.PrimaryKey = pkColumns;
 return dtProducts;
}

  首先,我们创建了一个DataTable对象,然后创建一个DataColumn。对于大多数表格列来说,我们仅需要设置数据类型和列名,尽管对于第一列("id")来说,我们还要把它设置为唯一的。这是因为我们要把它作为我们的主键;另外,在函数最后处还要求对之进行配置。之所以我们要使id总是唯一的,是因为我们要使用它来引用我们将在后面添加到DataSource上的各种产品;这样以来,我们能够从中选择特定的数据,例如只使用产品的价格与产品名。这个函数将返回一个空的DataTable,并因此仅被使用于getBasket()和populateProducts()中。

  现在,我们开始把实际的行数据添加到populateProducts()内的DataSource,详见下面的代码。每行对应一个不同的产品。添加一个新行到一个DataTable要求你创建一个新的DataRow,然后调用该DataTable的NewRow()函数。这将在DataTable内为新行留出位置,但是它不会实际地添加该行。

private void populateProducts()
{
 //创建基本结构
 DataTable dtProducts = createProductDT();
 //把产品添加到其上
 //创建初始的行
 DataRow aProduct = dtProducts.NewRow();
 aProduct["id"] = 11;
 aProduct["thumb"] = "images/widget0.jpg";
 aProduct["name"] = "Red Widget";
 aProduct["price"] = 19.99;
 dtProducts.Rows.Add(aProduct);
 //重用该行以添加新产品
 aProduct = dtProducts.NewRow();
 aProduct["id"] = 22;
 aProduct["thumb"] = "images/widget1.jpg";
 aProduct["name"] = "Green Widget";
 aProduct["price"] = 50.99;
 dtProducts.Rows.Add(aProduct);
 //把DataTable绑定到产品GridView
 gvProducts.DataSource = dtProducts;
 gvProducts.DataBind();

 //把产品存储到Session
 Session["dtProducts"] = dtProducts;
}

  首先,我们需要把一些数据添加到该行(例如id,缩略图像的路径,名称和价格)。一旦添加上这些内容,我们即可以调用Add()函数来实际地把我们的新行添加到DataTable。在该演示程序中,我们添加了六种产品,尽管在上面的片断中我们仅添加了两种。你能够看出我是如何实现"欺骗"的并且仅重用了相同的列和相同的行。一旦实现这一点,我们即把DataTable绑定到我们的GridView。详见下面的代码:

gvProducts.DataSource = dtProducts;
gvProducts.DataBind();

  还记得我们在第一篇中所讨论的RowDataBound事件吗?好,一旦我们调用了DataBind(),该函数被激活,即开始在页面上创建我们的数据。你应该清楚,在底层实现上,在这两个事件之间可能还会有其它事件发生;但是,为了更易于理解起见,我们仅考虑这两个事件。

  此后,我们还在会话状态中存储该DataTable的一个副本;这样以来,在以后我们每次想存取产品数据时,我们可以直接检索它而不必重新创建它。值得注意的是,尽管这种情况比较适合于针对一个小规模工程的一少部分数据;但是,当针对大型的应用程序时,你不应该象本例中这样使用会话状态-它会很容易地"吞掉"你的服务器内存;因此,即使使用一部分数据也有可能使用大量的内存,如果存在上千的用户同时访问它的话。在这个演示程序中,你将看到数据被从会话中多次提取;但是,在实际中,你可能实现众多数据库调用以便提取特定的数据子集(当需要它时)。

  值得注意的一个事情是,你能够设置"DataKeyNames",这些内容能够用来索引GridView中的项。产品列表和购物篮都分别实现单个DataKeyName:

DataKeyNames="id"

  这样,当后来点击"Add to basket"按钮以标识我们想添加的产品时使用它。在购物篮中,当更新数量时也使用它。你可以有多个键名,尽管大多数情况下你仅需要一个。

  在填充GridView前,你能够把一个空DataTable绑定到它上面。这将迫使它显示一个空行(你可以使用一个字符串来预填充)。在该演示中,这是使用两个GridView实现的,尽管你仅能看到其中的一个对应于购物篮,因为即使在你的商店中不存在产品也并不重要。你可以象下面这样使用"EmptyDataText"GridView属性来设置它:

EmptyDataText="~Basket is empty~"

  然后,它会象下图1这样被生成:


图1.购物篮为空时的提示。
    • 评论
    • 分享微博
    • 分享邮件
    邮件订阅

    如果您非常迫切的想了解IT领域最新产品与技术信息,那么订阅至顶网技术邮件将是您的最佳途径之一。

    重磅专题
    往期文章
    最新文章