ajax请求在ATG中的使用"/>
ajax请求在ATG中的使用
ATG的业务逻辑封装在了droplet和formhandler(我们暂且称其为组件)中,而组件使用DSP标签内嵌在JSP页面中,我们在JSP页面中向组件传递所需参数,ATG解析JSP页面中的组件,利用所提供的参数,访问后台repository获取数据,响应给页面。
这里的droplet和formhandler相当于MVC模式的中controller控制器,就像struts2中的action一样。但随即我们发现,虽然都是控制器,ATG的控制器是内嵌在view层中的,无法使用url访问,无法像异步访问action一样直接使用ajax请求。但是我们可以间接使用,如下所示:
1.使用ForEachDroplet遍历product的所有childSKUs,将遍历出的sku以下拉菜单显示,供买家选择,当前是sku.jsp页面:
<dsp:select id="selectSKU" bean="CartModifierFormHandler.catalogRefIds" multiple="false"><dsp:option value="-1"><dsp:valueof value="--select product--"/></dsp:option><dsp:droplet name="ForEach"><dsp:param name="array" param="product.childSKUs"/><dsp:param name="elementName" value="sku"/><dsp:oparam name="output"><dsp:option paramvalue="sku.repositoryId"/><dsp:valueof param="sku.displayName"/></dsp:oparam></dsp:droplet></dsp:select>
<div id="skuPrice"></div>
2.这里有个需求:买家选定待购买的sku后,动态获取该sku的价格,显示到sku.jsp,我们需要自定义price.jsp页面来被ajax请求,sku.jsp部分代码如下:
$(function(){$("#selectSKU").change(function(){var skuId = $("#selectSKU").val();if(skuId != -1){$.get("/price.jsp",{"skuId":skuId},function(data){var json = eval("("+data+")");$("#skuPrice").html("skuPrice:"+json.price);});}};
异步请求price.jsp页面,skuId作为页面参数传递给price.jsp页面中的PriceItemDroplet,数据响应给回调函数,供sku.jsp使用,price.jsp页面部分代码如下:
<dsp:droplet name="PriceItem"><dsp:param name="id" param="skuId"/><dsp:param name="elementName" value="pricedSKU"/><dsp:oparam name="output"><dsp:getvalueof var="price" param="pricedSKU.priceInfo.amount"/><%response.setContentType("text/html;charset=UTF-8");String json = "{\"price\":"+pageContext.getAttribute("price")+"}";response.getWriter().print(json);%></dsp:oparam>
</dsp:droplet>
以上就实现了ATG中的ajax请求。
更多推荐
ajax请求在ATG中的使用
发布评论