电子商务设计学生版ppt课件

1、-购货车与订单 模块 电子商务网站规划与实现购货车与订单 传统观念中的商店除必需有商品以外，还需求有店房、门面和货架等。而网上商店主要依托网络技术来完成商品展现、订购以及支付等项任务，网上商店既没有店房、门面也没有货架，因此网上商店常被称之为“虚拟商店。人们到超级商场去购买东西时，总得先将想买的商品从货架上取下来，放到购货车中，然后集中起来一同算账、付款。网上商店模拟这个购物过程，先让客户从不同的网页中选取商品，并将这些商品集中到“购货车中一同算账，最后生成完好的订单。网上购货车不同于实践的购货车，它是一种虚拟构造，称为“虚拟购货车。“虚拟购货车和“订单是商品采购中的中心部分，创建虚拟购货车和

2、订单是一门综合技术，可以采用多种方式。下面将要运用的技术包括：利用用户控件和主控页进展界面设计；实现数据表多表之间的同步；完成对数据表的显示、修正和统计。除此以外，还要动态生成内存中的数据表以及运用Session对象保管数据并在网页之间进展传送等。因此本章讲述的内容是前面多章内容的综合运用。 购货车与订单 概 述 设计用户控件及主控页 设 计 主 页 产品类型与产品目录之间同步 选 择 商 品 显示购货车 结 账 保 存 订 单 查 看 订 单 小 结 1 概 述 u1 Northwind样板库简介 u2 本系统的功能 u3 主要数据表的构造及其他预备任务 1 Northwind样板库简介 S

3、QL Server提供的Northwind样板库是一个虚拟的国外食品公司的数据库，我们将利用这个数据库(加以简化)来创建本人的购货车与订单。下面先对Northwind样板库做一个简单的引见。Northwind样板库包括十几张数据表，各表的关联以及数据表中各字段。Northwind样板库的数据表包括以下4部分。订单部分：包含订单表(Orders)、订单细目(Order Details)、订单发货(Shippers)。产品部分：包括类型表(Categories)、产品表(Products)、产品提供者(Suppliers)。雇员信息部分：包括有关雇员(Employees)的4张表。顾客信息：包括顾

4、客表(Customers)等。本设计将集中与订单相关的部分，除此以外还需求在数据库中自行建立一个简化的订单表，订单表的构造将在下面讲述。 1 Northwind样板库简介图 Northwind样板库中数据表的构造及相互关系 2 本系统的功能 2 本系统的功能 2 本系统的功能 了解系统的关键是搞清了解系统的关键是搞清GridView、内存数据表与、内存数据表与Session对象三者之间的关对象三者之间的关系。系统的执行过程是：进入系。系统的执行过程是：进入“主界面主界面(主页面这里没有画主页面这里没有画)，显示商品分类，显示商品分类，以及欢迎界面；在分类数据表以及欢迎界面；在分类数据表(Cat

5、egories)中任选一种数据类型，同步翻开中任选一种数据类型，同步翻开“产品产品.aspx网页，用网页，用GridView控件分类显示控件分类显示Products数据表中相应的商品；数据表中相应的商品；单击想要购买的商品，将该商品的数据取出来，放到下面的动态数据表中单击想要购买的商品，将该商品的数据取出来，放到下面的动态数据表中(数数据表用虚线画的长方形表示据表用虚线画的长方形表示)，然后再将数据表放入，然后再将数据表放入“购货车中，这里的购购货车中，这里的购货车用货车用SessionShoppingCart表示；翻开表示；翻开“购货车购货车.aspx网页，控件网页，控件GridView以以

6、SessionShoppingCart作为数据源显示数据，并在新网页中确作为数据源显示数据，并在新网页中确定购买的数量，并输入定购买的数量，并输入“客户标志；与此同时生成新的内存数据表，并将新客户标志；与此同时生成新的内存数据表，并将新数据表存入新的数据表存入新的SessionShoppingCart2中；翻开中；翻开“结账结账.aspx网页，以网页，以新新Session对象作为数据源在对象作为数据源在GridView控件中显示数据，同时经过控件中显示数据，同时经过Sessionkhbj将客户标志传入到网页中；在将客户标志传入到网页中；在“结账网页中完成计算总价结账网页中完成计算总价的任务，最

7、后存入订单；在的任务，最后存入订单；在“查看订单查看订单.aspx网页中以客户标志作为查询条网页中以客户标志作为查询条件显示订单，以便只显示客户本人的订单部分。件显示订单，以便只显示客户本人的订单部分。在上述各个阶段中，都允许客户对数据进展选择和修正。除开场阶段和最后在上述各个阶段中，都允许客户对数据进展选择和修正。除开场阶段和最后阶段需求直接存取数据库以外，其他部分均采用内存动态数据表来组织数据，阶段需求直接存取数据库以外，其他部分均采用内存动态数据表来组织数据，这样做可以提高系统的运转效率。这样做可以提高系统的运转效率。客户标志是识别客户的独一标志，平常存放在客户登录表中，包括有、联络客户

8、标志是识别客户的独一标志，平常存放在客户登录表中，包括有、联络方法等。详细工程由网络商店事先确定。方法等。详细工程由网络商店事先确定。 3 主要数据表的构造及其他预备任务 3 主要数据表的构造及其他预备任务 3 主要数据表的构造及其他预备任务 2 设计用户控件及主控页 为了使得系统具有很好的可重用性和可维护性，应该尽能够运用用户控件为了使得系统具有很好的可重用性和可维护性，应该尽能够运用用户控件(User Control) 以便发扬代码重用的优势以减少反复劳动，并且使得各个网页的显示风格一以便发扬代码重用的优势以减少反复劳动，并且使得各个网页的显示风格一致。致。1. 创建用户控件创建用户控件商

9、店的商标，网页之间链接的图标以及查询部分是大多数网页都需求显示的部分，可商店的商标，网页之间链接的图标以及查询部分是大多数网页都需求显示的部分，可以先将其建成用户控件。例如，这里我们将商店商标、几个网站阅读的控件以先将其建成用户控件。例如，这里我们将商店商标、几个网站阅读的控件(hyperLink)以及查询界面等分别做成用户控件。用户控件中的代码可以以后再补充上以及查询界面等分别做成用户控件。用户控件中的代码可以以后再补充上去。去。2. 创建主控页创建主控页先创建主控页然后再创建模板中的网页比较方便。主控页的规划如下图。先创建主控页然后再创建模板中的网页比较方便。主控页的规划如下图。 主控页的

10、上方放的是用户控件，左下方放的是主控页的上方放的是用户控件，左下方放的是GridView控件，该控件与类型表控件，该控件与类型表(Categories)进展数据绑定，右下方是给各网页留下的空间。进展数据绑定，右下方是给各网页留下的空间。2 设计用户控件及主控页 主控页的规划3 设 计 主 页 主页是客户访问的第一个页面，可以给客户提供主页是客户访问的第一个页面，可以给客户提供第一印象。它的主要义务是吸引客户并引导客户第一印象。它的主要义务是吸引客户并引导客户进入选购界面。一个好的主页应该生动、明晰，进入选购界面。一个好的主页应该生动、明晰，可以激发出客户购买的兴趣。可以激发出客户购买的兴趣。在

11、主控页中生成一个主页，设计欢迎界面，其简在主控页中生成一个主页，设计欢迎界面，其简要情况如图要情况如图 所示。所示。在主控页中分别再生成其他网页。例如在主控页中分别再生成其他网页。例如“商商品品.aspx、“购货车购货车.aspx、“结账结账.aspx、“订订单单.aspx等。这些网页的内容可以以后再补充。等。这些网页的内容可以以后再补充。在用户控件中将链接指针分别与各个网页链接。在用户控件中将链接指针分别与各个网页链接。3 设 计 主 页 欢迎界面4 产品类型与产品目录5 选 择 商 品 u5.1 选择按钮触发的事件 u5.2 如何取出数据 u5.3 如何创建数据表 5 选 择 商 品 为了

12、选择商品，在产品表中的栏目为了选择商品，在产品表中的栏目(Column)中添加一按中添加一按钮钮(Button)，并且在它的，并且在它的CommdName属性中取名为属性中取名为“select(也可以取其他名字也可以取其他名字)。当单击该按钮时，将该产。当单击该按钮时，将该产品的副本取出来动态生成数据表，利用这个动态数据表来品的副本取出来动态生成数据表，利用这个动态数据表来生成生成“购货车。购货车。为了生成这个数据表，需求处理以下三个问题：为了生成这个数据表，需求处理以下三个问题：单击按钮时将触发什么事件；单击按钮时将触发什么事件；如何提取如何提取GridView控件中的数据；控件中的数据；如

13、何创建动态数据表并将取出的数据放入其中。如何创建动态数据表并将取出的数据放入其中。 5.1 选择按钮触发的事件 GridView 控件中的控件中的RowCommand事件，是事件，是GridView控件内任一按控件内任一按钮都将触发的事件。因此在运用这个事件时，先要判别当前点击的是钮都将触发的事件。因此在运用这个事件时，先要判别当前点击的是哪个按钮。判别的方法是根据按钮的命令名，语句如下：哪个按钮。判别的方法是根据按钮的命令名，语句如下：If (emandName=按钮命令名按钮命令名) 5.2 如何取出数据 根据鼠标点击的根据鼠标点击的“行以及在行以及在GridView中的中的“列，可以取出

14、相应的列，可以取出相应的数据。确定点击行的语句是：数据。确定点击行的语句是：int index = Convert.ToInt32(emandArgument);GridViewRow row = GridView1.Rowsindex;取出某列的语句是：取出某列的语句是：string bhText = row.Cells1.Text;string mcText = row.Cells2.Text;上述语句提取出鼠标点击的行中第上述语句提取出鼠标点击的行中第2列和第列和第3列中的数据列中的数据(列的序号从列的序号从0开场开场)。 5.3 如何创建数据表 先根据类库中的类生成数据表对象，然后定义

15、数据表的构造，定义数据表各列的数据类型及标题。语句如下：先根据类库中的类生成数据表对象，然后定义数据表的构造，定义数据表各列的数据类型及标题。语句如下： System.Data.DataTable Cart = new System.Data.DataTable();/ 定义数据表对象定义数据表对象 if (emandName = select) if (SessionShoppingCart = null) Cart.Columns.Add(商品编号商品编号, typeof(int); / 确定各列的标题及类型确定各列的标题及类型 Cart.Columns.Add(商品称号商品称号, typ

16、eof(string); Cart.Columns.Add(单元含量单元含量, typeof(string); Cart.Columns.Add(单价单价, typeof(double); SessionShoppingCart = Cart; / / 再取出各列的数据，同时进展类型转换再取出各列的数据，同时进展类型转换 Cart = (System.Data.DataTable)SessionShoppingCart; int index = Convert.ToInt32(emandArgument); GridViewRow row = GridView1.Rowsindex; stri

17、ng bhText = row.Cells1.Text; string mcText = row.Cells2.Text; string dyText = row.Cells4.Text; string djText = row.Cells5.Text; int bh = int.Parse(bhText);double dj = double.Parse(djText);/ 然后添加数据行，并将数据填入该行的各列之中。然后添加数据行，并将数据填入该行的各列之中。 System.Data.DataRow rr = Cart.NewRow(); rr商品编号商品编号=bh; rr商品称号商品称号

18、 = mcText; rr单元含量单元含量 = dyText; rr单价单价 = dj; Cart.Rows.Add(rr); / 将新行参与数据表中将新行参与数据表中SessionShoppingCart = Cart; 5.3 如何创建数据表 由于默许情况下，网页之间不坚持形状，当他选择多行时，购货车中只会保管最后一项选择。为了可以在购货车中由于默许情况下，网页之间不坚持形状，当他选择多行时，购货车中只会保管最后一项选择。为了可以在购货车中保管多项选择，需求利用保管多项选择，需求利用Session 对象来坚持形状。以下语句的作用就是经过对象来坚持形状。以下语句的作用就是经过Session来

19、坚持形状。来坚持形状。if(SessionShoppingCart=null) Cart = new DataTable(); SessionShoppingCart=Cart;Cart = (System.Data.DataTable)SessionShoppingCart;综合以上所述，创建内存数据表的完好代码如下：综合以上所述，创建内存数据表的完好代码如下： void GridView1_RowCommand(object sender, GridViewCommandEventArgs e) System.Data.DataTable Cart = new System.Data.Da

20、taTable(); / 生成内存数据表对象生成内存数据表对象 if (emandName = select) if (SessionShoppingCart = null) / 定义数据表构造定义数据表构造 Cart.Columns.Add(商品编号商品编号, typeof(int);5.3 如何创建数据表 Cart.Columns.Add(商品称号商品称号, typeof(string); Cart.Columns.Add(单元含量单元含量, typeof(string); Cart.Columns.Add(单价单价, typeof(double); SessionShoppingCart

21、 = Cart; Cart = (System.Data.DataTable)SessionShoppingCart; int index=Convert.ToInt32(emandArgument); / 确定点击的行确定点击的行 GridViewRow row = GridView1.Rowsindex; string bhText = row.Cells1.Text; / 取出列中的数据取出列中的数据 string mcText = row.Cells2.Text; string dyText = row.Cells4.Text; string djText = row.Cells5.T

22、ext; int bh = int.Parse(bhText); / 数据的类型转换数据的类型转换 double dj = double.Parse(djText); System.Data.DataRow rr = Cart.NewRow(); rr商品编号商品编号=bh; / 将取出的数据放入数据表中将取出的数据放入数据表中 rr商品称号商品称号 = mcText; rr单元含量单元含量 = dyText; rr单价单价 = dj; Cart.Rows.Add(rr); / 将新行参与数据表中将新行参与数据表中 SessionShoppingCart = Cart; / 将数据表放入将数据

23、表放入Session中中 6 显示购货车 u6.1 输入客户标志 u6.2 在GridView中添加按钮 u6.3 添加模板列 u6.4 在窗体页的Page_Load事件中添加条件 u6.5 在GridView的RowCommand事件中编写代码 6 显示购货车 在购货车的显示页面中，将在购货车的显示页面中，将SessionShoppingCart作为数据源显示在作为数据源显示在GridView中，语中，语句如下：句如下：private void Page_Load(object sender, System.EventArgs e)GridView1.DataSource= SessionS

24、hoppingCart;DataBind();购货车在这里就是放在购货车在这里就是放在Session对象中的数据表。用对象中的数据表。用Session对象保管购货车是最恰当的方对象保管购货车是最恰当的方式。由于每个客户都有属于本人的式。由于每个客户都有属于本人的Session对象，即使多个客户同时进展网上购买时，他对象，即使多个客户同时进展网上购买时，他们的数据也不会混杂。另外们的数据也不会混杂。另外Session对象是一种暂时性的容器，非常符合购货车的特点。对象是一种暂时性的容器，非常符合购货车的特点。首先在数据库中创建首先在数据库中创建“订单表。结账窗体界面中的表的构造最好与数据库中的订单

25、表。结账窗体界面中的表的构造最好与数据库中的“订单表订单表一致。和购货车相比，数据表中添加了几个字段一致。和购货车相比，数据表中添加了几个字段(如订购数量、合计等如订购数量、合计等)，因此应该重新组，因此应该重新组织数据表，并运用另一个织数据表，并运用另一个Session对象对象(这里运用这里运用ShoppingCart2)。为了完善购货车中的数据以便转入结账界面，在购货车的窗体中还需求执行以下为了完善购货车中的数据以便转入结账界面，在购货车的窗体中还需求执行以下5方面的方面的任务。任务。(1)在窗体页中用一在窗体页中用一TextBox控件以输入用户标志。控件以输入用户标志。(2)在在Grid

26、View控件中添加一个按钮控件中添加一个按钮(Button)，将其，将其CommandName属性设成属性设成“select。(3)在在GridView控件中添加一模板列，放入控件中添加一模板列，放入TextBox控件，以便输入购买数量。控件，以便输入购买数量。(4)在窗体页的在窗体页的Page_Load事件中加上条件：事件中加上条件：if(!IsPostBack) 。(5)在在GridView的的RowCommand事件中编写代码事件中编写代码(代码在下一节中讲述代码在下一节中讲述)。购货车窗体的界面如下图。购货车窗体的界面如下图。 6 显示购货车 购货车的窗体界面6.1 输入客户标志 客户

27、标志必需具有独一性和可靠性，根据该标志可以与客户联络，确定发货的方法和地址，为此须添加输入客户标志的TextBox控件，以及相应的RequiredFieldValidator校验控件，以防止输入中的脱漏。6.2 在GridView中添加按钮 经过GridView的Columns属性中添加一按钮，并为它的CommandName属性命名(例如命名为“buy)，以便确认选择项。6.3 添加模板列 在GridView控件中添加一个模板列，将TextBox1控件放入ItemTemplate模板中，以便输入购买数量。先将其默许值设为1。6.4 在窗体页的Page_Load事件中添加条件 为了进展结账的计算

28、，须在Page_Load事件中添加以下条件：private void Page_Load(object sender, System.EventArgs e) if(!IsPostBack)GridView1.DataSource= SessionShoppingCart;DataBind(); IsPostBack属性是为了区分网页是第一次被翻开，还是后续翻开(事件处置后的前往)。当网页为后续翻开时，该属性为true，否那么为false。if(!IsPostBack) / 执行语句以上代码阐明只需网页第一次(不是后续)翻开时才执行大括号中的语句。 6.5 在GridView的RowComma

29、nd事件中编写代码 void GridView1_RowCommand(object sender, GridViewCommandEventArgs e) System.Data.DataTable Cart = new System.Data.DataTable();/生成数据表 if (emandName = buy) if (SessionShoppingCart2 = null) Cart.Columns.Add(商品编号, typeof(int); /建立数据表构造 Cart.Columns.Add(商品称号, typeof(string); Cart.Columns.Add(单元

30、含量, typeof(string); Cart.Columns.Add(单价, typeof(double); Cart.Columns.Add(订购数量, typeof(int); Cart.Columns.Add(折扣, typeof(double); Cart.Columns.Add(合计, typeof(double); SessionShoppingCart2 = Cart; Cart = (System.Data.DataTable)SessionShoppingCart2; if (TextBox2.Text = ) / 输入客户标志 Validate(); / 调用校验控件进

31、展校验 else 6.5 在GridView的RowCommand事件中编写代码 Sessionkhbj = TextBox2.Text; int index = Convert.ToInt32(emandArgument); GridViewRow row = GridView1.Rowsindex; TextBox tt = (System.Web.UI.WebControls.TextBox)row.Cells1.FindControl(TextBox1); string dgl = tt.Text; int dg = int.Parse(dgl); if (dg = 1) dg = 1

32、; / 假设购货量小于1时，定为1 string bhText = row.Cells2.Text; string mcText = row.Cells3.Text; string dyText = row.Cells4.Text; string djText = row.Cells5.Text; int bh = int.Parse(bhText); double dj = double.Parse(djText); System.Data.DataRow rr = Cart.NewRow(); rr商品编号=bh; rr商品称号 = mcText; rr单元含量 = dyText; rr单

33、价 = dj; rr订购数量 = dg; int zk = 1; rr折扣 = zk; double hj = dj * dg * zk; / 合计运用三者的乘积 rr合计 = hj; Cart.Rows.Add(rr); SessionShoppingCart2 = Cart; 7 结 账 u7.1 结账网页的数据显示 u7.2 在GridView控件中添加复选框 u7.3 汇总的计算 7.1 结账网页的数据显示 在结账网页中的GridView控件应该以SessionShoppingCart2作为数据源显示数据，其语句如下：private void Page_Load(object send

34、er, System.EventArgs e)GridView1.DataSource= SessionShoppingCart2;DataBind();7.2 在GridView控件中添加复选框 为了允许客户在结账时有时机对本人的选择做进一步伐整，可以在结账界面的每条记录前面添加一复选框。默许情况下这些复选框都被选中，假设想撤销该项选择时，只须取消该复选框的选择即可，订单表中将不会存入被取消的选项。为了添加复选框，需求在GridView中经过Column属性增添一“模板字段，并且在模板中增添复选框控件。模板的设置代码如下： 结账的界面如下图。在这个界面中，客户标志和表格中的数据均从上一个网页

35、传来。在结账界面主要完成汇总计算以及将订单表存入数据库的操作。7.2 在GridView控件中添加复选框 结账的界面7.3 汇总的计算 当单击【汇总】按钮时，显示框中将显示总和。假设改动了复选框的选择，汇总的结果也应该跟随着改动。为了进展汇总计算，需设置循环语句，逐条检查复选框的选择形状，只需该复选框被选中时，才将该记录的数据计入汇总中。此处需求用到的类和方法 如下。GridView1.Rowsii用来表示 GridView 控件中的某一行。FindControl(控件的id)方法：用来在当前的命名容器中搜索带指定 id 参数的效力器控件。汇总按钮的代码如下：void Button2_Clic

36、k(object sender, EventArgs e) double sum=0.0; for(int ii=0; ii GridView1.Rows.Count;ii+) CheckBox cc = (CheckBox)GridView1.Rowsii.Cells0.FindControl(CheckBox1); if(cc.Checked) / 假设复选框被选中 sum = sum + (double.Parse(GridView1.Rowsii.Cells7.Text); TextBox2.Text=sum.ToString(); / 显示汇总结果 为实现复选框的功能，在Page_L

37、oad事件中需求做一些改动。代码如下：void Page_Load(object sender, EventArgs e) if (!IsPostBack) TextBox1.Text = Sessionkhbz.ToString(); GridView1.DataSource = SessionShoppingCart2; GridView1.DataBind(); 8 保 存 订 单 假设客户对结果感到称心时，可单击【存入数据库】按钮，将订单存入数据库的“订单表 中。存入时运用存储过程，为此需求先建立订单表，表的构造如前面所示，另外还需求在数据库端创建存储过程，这里需求创建一个添加新记录的

38、存储过程。运用的语句如下：INSERT INTO dbo.订单表(客户ID, 产品ID, 产品称号, 单位数量, 单价, 订购量, 订购时间) VALUES (客户ID, 产品ID, 产品称号, 单位数量, 单价, 订购量, 订购时间);在数据库端设置的存储过程如图 所示。为了调用存储过程，从【工具箱】中拖入一SqlDataSource控件并与存储过程衔接。衔接过程中最大的不同点是对待定参数赋值的方式。这些待定参数的值不是从固定的控件中读取，而是经过循环语句从GridView控件(代表内存中的订单)的字段中获得。待定参数的赋值过程是：开场对GridView控件逐条记录进展循环；在循环语句中首先取出复选框的形状，判别复选框能否被选中；假设被选中，先去除原有参数，然后给各参数赋值；最后调用存储过程以存入订单。详细的代码如下：void Button1_Click(object sender, Even