asp.net 购物车的实现浅析

该购物车的功能如下:
. 通过ajax实现添加和删除车上的物品。
. 删除的物品会显示出来,可以重新添加到购物车。
. 嗯...没有了,具体大家接着看吧。

购物车的结构我打算用一个table来展示,在UserControl里使用ListView展现购物车的物品(因为比拼接字符串要容易维护的多)。具体代码如下(ShopCartTest.ascx):

复制代码 代码如下:


<asp:ListView runat="server">
<LayoutTemplate>
<table runat="server" cellpadding='0' cellspacing='0'>
<tr>
<td>
商品编号
</td>
<td>
商品名称
</td>
<td>
京东价
</td>
<td>
返现
</td>
<td>
赠送积分
</td>
<td>
商品数量
</td>
<td>
删除商品
</td>
</tr>
<tr runat="server" />
<tr>
<td colspan='7'>
重量总计:<%= this.GetProductsWeight() %>kg&nbsp;&nbsp;&nbsp;原始金额:¥307.00元 - 返现:¥0.00元<br />
<span><b>商品总金额(不含运费):<span>¥307.00</span>元</b></span>
</td>
</tr>
</table>
</LayoutTemplate>
<ItemTemplate>
<tr>
<td>
<%#(Container.DataItem as Product).ID %>
</td>
<td>
<a target='_blank' href='http://www.xxx.com/product/<%#(Container.DataItem as Product).ID %>.html'>
<%#(Container.DataItem as Product).Name %></a>
</td>
<td>
<span>
<%#(Container.DataItem as Product).Price %></span>
</td>
<td>
<%#(Container.DataItem as Product).BackMoney %>
</td>
<td>
<%#(Container.DataItem as Product).Score %>
</td>
<td>
<a href='#none' title='减一'
style='text-decoration: none'>-</a><input type='text'
name='txtChange<%#(Container.DataItem as Product).ID %>' maxlength='4'
value='<%#(Container.DataItem as Product).Count %>' /><a href='#none' title='加一'
onclick="changeCount('+','<%#(Container.DataItem as Product).ID %>');">+</a>
</td>
<td>
<a href='#none'>
删除</a>
</td>
</tr>
</ItemTemplate>
</asp:ListView>


我想大家应不用我解释代码的意思了,很简单。
后台代码如下:

复制代码 代码如下:


public partial class ShopCartTest : System.Web.UI.UserControl
{
List<Product> productsList = null;
protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
switch (Acion)
{
case "removeProductOnShoppingCart":
productsList = Product.GetProductsInCart(ProductID);
break;
case "changeProductCount":
productsList = Product.GetProductsInCart(null);
foreach (var item in productsList)
{
if (item.ID == ProductID)
{
item.Count = "3";
}
}
break;
case "AddProduct":
productsList = Product.GetProductsInCart(null);
productsList.Add(new Product() { ID = "173233", Name = "ElandMX9470", Price = "399.00", BackMoney = "0.00", Score = "0", Count = "1" });
break;
default:
productsList = Product.GetProductsInCart(ProductID);
break;
}
ListView1.DataSource = productsList;
ListView1.DataBind();
}
public string GetProductsWeight()
{
return Product.GetProductsInCart(ProductID).Sum(p => decimal.Parse(p.Price) * decimal.Parse(p.Count)).ToString();
}
public string GetProductsOriginalPrice()
{
return Product.GetProductsInCart(ProductID).Sum(p => decimal.Parse(p.Price) * decimal.Parse(p.Count)).ToString();
}
public string ProductID { get; set; }
public string Acion { get; set; }
}


把对购物车的逻辑都写到这里面,通过action来判断是什么操作,一样简单的代码。再来看看Product类:

复制代码 代码如下:


public class Product
{
public string ID { get; set; }
public string Name { get; set; }
public string Price { get; set; }
public string BackMoney { get; set; }
public string Score { get; set; }
public string Count { get; set; }

public static List<Product> GetProductsInCart(string productID)
{
List<Product> list = new List<Product>()
{
new Product{ID="173259",Name="毛毛仔妮妮熊MX9470",Price="99.00",BackMoney="0.00",Score="0",Count="1"},
new Product{ID="155097",Name="xxxxxx新款轻巧便携式电脑桌(送鼠标垫)",Price="79.00",BackMoney="¥0.00",Score="0",Count="1"},
new Product{ID="155098",Name="xxxxxx护眼台灯(理想)STL-T412W-03WT",Price="69.00",BackMoney="¥0.00",Score="0",Count="1"}
};
return list.Where(p => { return p.ID != productID; }).ToList();
}
}


接下来在ShopCartDetail.aspx页面使用该UserControl:

复制代码 代码如下:


<div>
<demo:ShopCartTest runat="server" />
</div>


通过ajax使用购物车还需要两个类:

复制代码 代码如下:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wjjdgw.html