仓酷云
标题:
ASP.NET教程之asp.net 购物车的完成浅析
[打印本页]
作者:
海妖
时间:
2015-1-16 22:20
标题:
ASP.NET教程之asp.net 购物车的完成浅析
2003年中微软发布最新版本的ASP.netWebMatrix,对于我们喜欢用Asp.net来编程的朋友实在是个好消息,我也实实在在的将Asp.net更深入的研究了一下,以方便我以后更好的运用它,同时我也讲讲使用它的感受。该购物车的功效以下:
.经由过程ajax完成增加和删除车上的物品。
.删除的物品会显现出来,能够从头增加到购物车。
.嗯...没有了,详细人人接着看吧。
购物车的布局我盘算用一个table来展现,在UserControl里利用ListView展示购物车的物品(由于比拼接字符串要简单保护的多)。详细代码以下(ShopCartTest.ascx):
复制代码
代码以下:
<asp:ListViewID="ListView1"runat="server">
<LayoutTemplate>
<tablerunat="server"cellpadding=0cellspacing=0width=100%>
<tr>
<tdwidth=7%style=height:30px>
商品编号
</td>
<td>
商品称号
</td>
<tdwidth=10%>
京东价
</td>
<tdwidth=8%>
返现
</td>
<tdwidth=8%>
赠予积分
</td>
<tdwidth=9%>
商品数目
</td>
<tdwidth=7%>
删除商品
</td>
</tr>
<trrunat="server"id="itemPlaceholder"/>
<tr>
<tdcolspan=7style=height:30px>
分量总计:<%=this.GetProductsWeight()%>kg原始金额:¥307.00元-返现:¥0.00元<br/>
<spanstyle=font-size:14px><b>商品总金额(不含运费):<spanid=cartBottom_price>¥307.00</span>元</b></span>
</td>
</tr>
</table>
</LayoutTemplate>
<ItemTemplate>
<tr>
<tdstyle=padding:5px05px0;>
<%#(Container.DataItemasProduct).ID%>
</td>
<td>
<atarget=_blankhref=http://www.xxx.com/product/<%#(Container.DataItemasProduct).ID%>.html>
<%#(Container.DataItemasProduct).Name%></a>
</td>
<td>
<span>
<%#(Container.DataItemasProduct).Price%></span>
</td>
<td>
<%#(Container.DataItemasProduct).BackMoney%>
</td>
<td>
<%#(Container.DataItemasProduct).Score%>
</td>
<td>
<ahref=#nonetitle=减一
style=text-decoration:none>-</a><inputtype=textid=txt<%#(Container.DataItemasProduct).ID%>
name=txtChange<%#(Container.DataItemasProduct).ID%>maxlength=4style=width:30px
value=<%#(Container.DataItemasProduct).Count%>/><ahref=#nonetitle=加一
style=text-decoration:none>+</a>
</td>
<td>
<ahref=#noneid=btn_del_173259>
删除</a>
</td>
</tr>
</ItemTemplate>
</asp:ListView>
我想人人应不必我注释代码的意义了,很复杂。
背景代码以下:
复制代码
代码以下:
publicpartialclassShopCartTest:System.Web.UI.UserControl
{
List<Product>productsList=null;
protectedoverridevoidOnPreRender(EventArgse)
{
base.OnPreRender(e);
switch(Acion)
{
case"removeProductOnShoppingCart":
productsList=Product.GetProductsInCart(ProductID);
break;
case"changeProductCount":
productsList=Product.GetProductsInCart(null);
foreach(variteminproductsList)
{
if(item.ID==ProductID)
{
item.Count="3";
}
}
break;
case"AddProduct":
productsList=Product.GetProductsInCart(null);
productsList.Add(newProduct(){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();
}
publicstringGetProductsWeight()
{
returnProduct.GetProductsInCart(ProductID).Sum(p=>decimal.Parse(p.Price)*decimal.Parse(p.Count)).ToString();
}
publicstringGetProductsOriginalPrice()
{
returnProduct.GetProductsInCart(ProductID).Sum(p=>decimal.Parse(p.Price)*decimal.Parse(p.Count)).ToString();
}
publicstringProductID{get;set;}
publicstringAcion{get;set;}
}
把对购物车的逻辑都写到这内里,经由过程action来判别是甚么操纵,一样复杂的代码。再来看看Product类:
复制代码
代码以下:
publicclassProduct
{
publicstringID{get;set;}
publicstringName{get;set;}
publicstringPrice{get;set;}
publicstringBackMoney{get;set;}
publicstringScore{get;set;}
publicstringCount{get;set;}
publicstaticList<Product>GetProductsInCart(stringproductID)
{
List<Product>list=newList<Product>()
{
newProduct{ID="173259",Name="毛毛仔妮妮熊MX9470",Price="99.00",BackMoney="0.00",Score="0",Count="1"},
newProduct{ID="155097",Name="xxxxxx新款轻便便携式电脑桌(送鼠标垫)",Price="79.00",BackMoney="¥0.00",Score="0",Count="1"},
newProduct{ID="155098",Name="xxxxxx护眼台灯(幻想)STL-T412W-03WT",Price="69.00",BackMoney="¥0.00",Score="0",Count="1"}
};
returnlist.Where(p=>{returnp.ID!=productID;}).ToList();
}
}
接上去在ShopCartDetail.aspx页面利用该UserControl:
复制代码
代码以下:
<divid="products">
<demo:ShopCartTestID="ShopCartTest1"runat="server"/>
</div>
经由过程ajax利用购物车还必要两个类:
复制代码
代码以下:
publicclassGetProducts:IHttpHandler
{
publicvoidProcessRequest(HttpContextcontext)
{
context.Response.ContentType="text/plain";
ViewManager<ShopCartTest>viewManager=newViewManager<ShopCartTest>();
ShopCartTestcontrol=viewManager.LoadViewControl("~/ShopCartTest.ascx");
control.ProductID=context.Request.QueryString["productId"];
control.Acion=context.Request.QueryString["action"];
context.Response.Write(viewManager.RenderView(control));
}
publicboolIsReusable
{
get
{
returnfalse;
}
}
}
复制代码
代码以下:
publicclassViewManager<T>whereT:UserControl
{
privatePagem_pageHolder;
publicTLoadViewControl(stringpath)
{
m_pageHolder=newPage();
returnthis.m_pageHolder.LoadControl(path)asT;
}
publicstringRenderView(Tcontrol)
{
StringWriteroutput=newStringWriter();
this.m_pageHolder.Controls.Add(control);
HttpContext.Current.Server.Execute(this.m_pageHolder,output,false);
returnoutput.ToString();
}
}
这两个类是参考老赵提出来的计划完成,详细道理,你能够看这里。
剩上去都是javascript了,这里我并没有利用任何类库大概框架。代码以下:
复制代码
代码以下:
functionajaxCommon(requst){
2varxmlHttp=false;
3if(window.ActiveXObject){
4xmlHttp=newActiveXObject("Microsoft.XMLHTTP");
5}
6else{
7if(window.XMLHttpRequest){
8xmlHttp=newXMLHttpRequest();
9}
}
xmlHttp.onreadystatechange=function(){getAjaxValue(xmlHttp)}
xmlHttp.open("GET","/GetProducts.ashx"+?roid=+Math.random()+&+requst);
xmlHttp.send(null);
}
functiongetAjaxValue(xmlHttp){
if(xmlHttp.readyState==4){
if(xmlHttp.status==200){
document.getElementById("products").innerHTML=xmlHttp.responseText;
}
}
}
functionaddProduct(productID,productCount){
ajaxCommon("action=AddProduct&productId="+productID+"&productCount="+productCount);
}
functionremoveProductOnShoppingCart(productId,obj){
debugger;
setDelProduct(obj,productId);
ajaxCommon("action=removeProductOnShoppingCart&productId="+productId);
setDelProductShow();
}
functionchangeCount(type,productID){
varchangeCount=0;
vartxtCount=0;
if(type=="-"){
changeCount=-1;
}
if(type=="+"){
changeCount=1;
}
txtCount=document.getElementById("txt"+productID).value;
ajaxCommon("action=changeProductCount&productId="+productID+"&productCount="+txtCount);
}
functionDeledProductInfo(){
this.ID=;
this.Name=;
this.Price=;
this.Count=;
}
vardelProduct=null;
functionsetDelProduct(obj,productID){
try{
delProduct=newDeledProductInfo();
vartrObj=obj.parentNode.parentNode;
delProduct.ID=trObj.cells[0].innerHTML;
delProduct.Name=trObj.cells[1].innerHTML;
delProduct.Price=trObj.cells[2].innerHTML;
delProduct.Count=document.getElementById(txt+productID).value;
}catch(e){}
}
functionsetDelProductShow(){
try{
if(document.getElementById(divDeledProduct)==null)return;
if(delProduct!=null&&delProduct.ID!=){
vardHtml="<table><tr>";
dHtml+="<tdstyle=width:70px>"+delProduct.ID+"</td>";
dHtml+="<tdstyle=text-align:left>"+delProduct.Name+"</td>";
dHtml+="<td>"+delProduct.Price+"</td>";
dHtml+="<td>"+delProduct.Count+"</td>";
dHtml+="<td><ahref=#noneonclick="addProduct("+delProduct.ID+","+delProduct.Count+");reAddedProduct(delProduct"+delProduct.ID+");">从头购置</a></td>";
dHtml+="</tr></table>";
document.getElementById(divDeledProduct).style.display=;
document.getElementById(divDeledProduct).innerHTML+="<divid=delProduct"+delProduct.ID+">"+dHtml+"</div>";
}
delProduct=null;
}catch(e){}
}
functionreAddedProduct(reAddDivId){
try{
debugger;
document.getElementById(divDeledProduct).removeChild(document.getElementById(reAddDivId));
if(document.getElementById(divDeledProduct).childNodes.length==0){
document.getElementById(divDeledProduct).style.display=none;
}
}catch(e){}
}
代码仍旧很简单看懂,必要注释的就是删除的操纵,分为三步:
将必要删除的物品先保留起来:setDelProduct(obj,productId);
在背景购物车清单下面将物品删除,并前往删除后的物品清单:ajaxCommon("action=removeProductOnShoppingCart&productId="+productId);
将删除的物品输入,放到已删除列表(完整在客户端操纵):setDelProductShow();
另有从删除列表中将删除的物品从头增加到购物车傍边,分为两步:
在背景将物品增加到物品清单(和间接增加物品挪用统一个办法):addProduct
从已删除列表中将该物品删除(完整在客户端操纵):reAddedProduct
如许,一个基础的购物车就完成了。可是详细关于数据的操纵,必要您进一步处置。本文关于数据的操纵只是示例罢了。在CSDN里搜索一下“初学”两字,竟有三百余篇帖子(也许更多)。有些帖子说,有了asp的基础,只要15天就能很熟悉了,我甚感自己的愚钝。更多帖子是向大家请教初学者适合看书。两个多月的时间(当然平常杂事比较多。
作者:
海妖
时间:
2015-1-19 08:54
大哥拜托,Java在95年就出来了,微软垄断个妹啊,服务器市场微软完全是后后来者,当年都是Unix的市场,现在被WindowsServer和Linux抢下大片,包括数据库也一样。
作者:
若相依
时间:
2015-1-25 18:17
主流网站开发语言之CGI:CGI就是公共网关接口(CommonGatewayInterface)的缩写。它是最早被用来建立动态网站的后台技术。这种技术可以使用各种语言来编写后台程序,例如C,C++,Java,Pascal等。
作者:
透明
时间:
2015-2-3 12:58
提供基于组件、事件驱动的可编程网络表单,大大简化了编程。还可以用ASP.NET建立网络服务。
作者:
谁可相欹
时间:
2015-2-26 18:52
现在的ASP.net分为两个版本:1.1和2.0Asp.net1.1用VS2003(visualstudio2003)编程。Asp.net2.0用VS2005(visualstudio2005)编程。现在一般开发用的是VS2003。
作者:
飘飘悠悠
时间:
2015-3-8 16:40
有一丝可惜的是,这个系列太强了,Java阵营的朋友根本就是哑口无言...争论之火瞬间被浇灭,这不是我想这么早就看到的,但是值了。
作者:
小女巫
时间:
2015-3-16 06:53
是目前ASP在UNIX/Linux上的应用可以说几乎为0)。所以平台的局限性和ASP自身的安全性限制了ASP的广泛应用。
作者:
再现理想
时间:
2015-3-22 21:08
现在的ASP.net分为两个版本:1.1和2.0Asp.net1.1用VS2003(visualstudio2003)编程。Asp.net2.0用VS2005(visualstudio2005)编程。现在一般开发用的是VS2003。
作者:
深爱那片海
时间:
2015-3-22 21:08
在asp.net虚拟主机的服务提供商中,目前首推的是CNNIC的其中一家域名注册机构---时代互联(www.now.net.cn),他们早在2001年微软刚推出Asp.net时就推出了对应的Asp.net虚拟主机了,经笔者的使用测试,他提供的Asp.net性能非常的稳定,版本也会定期的更新,目前他的
欢迎光临 仓酷云 (http://ckuyun.com/)
Powered by Discuz! X3.2