在一個頁面加載另一個渲染的頁面
標簽:
JavaScript
<div id="moreLikeThis" class="section_offset"> <div class="tabs products " > <ul class="tabs_nav clearfix " > <li style="width: 235px;"><a href="#tab-5">You Might Also Like</a></li> </ul> <div class="tab_containers_wrap" > <div id="tab-5" class="tab_container" style="width:235px;"> <div class="owl_carousel carousel_in_tabs type_2 likecontent"> </div> </div> </div> </div> </div>
<script type="text/javascript">
jQuery().ready(function () {
$("#moreLikeThis").load("/products/similarProduct.json",{maxResult:8,pageNo:0,productId:${GoodsDetailsForm.id}})@RequestMapping(value = "similarProduct.json", method = RequestMethod.POST)
public String getSimilarProduct(HttpServletRequest request,
ModelMap model,
@RequestParam(value = "maxResult") int maxResult,
@RequestParam(value = "pageNo") int pageNo,
@RequestParam(value = "productId", defaultValue = "0") long productId,
HttpSession session) {
Locale currentLocale = getRequestLanguage(session, request);
ProductJsons productJsons = null;
productJsons = extendProductService.moreLikeTag(productId, maxResult, currentLocale.toString());
if (productJsons != null) {
if (productJsons.getProductJsonList() != null) {
ArrayList<Long> ids = new ArrayList<>();
for (ProductJson productJson : productJsons.getProductJsonList()) {
ids.add(productJson.getId());
}
model.addAttribute("ratingMap", getAverageRatingById(ids));
model.addAttribute("checkWish", checkWishById(ids));
model.addAttribute("productJsons", productJsons);
}
}
return "moreLikeThis";
}moreLikeThis.jsp
<%@ page language="java" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<c:if test="${not empty productJsons and not empty productJsons.productJsonList}">
<div class="tabs products" style="height: 450px;">
<ul class="tabs_nav clearfix">
<li style="width: 235px;"><a href="#tab-5">You Might Also Like</a></li>
</ul>
<div class="tab_containers_wrap">
<div id="tab-5" class="tab_container">
<div class="owl_carousel carousel_in_tabs type_2 likecontent">
<c:forEach items="${productJsons.productJsonList}" var="product">
<c:choose>
<c:when test="${not empty product.promotionPrice.price}">
<c:set var="price" value="${currency.symbol}${product.promotionPrice.price}"></c:set>
</c:when>
<c:otherwise>
<c:set var="price" value="${currency.symbol}${product.displayPrice.price}"></c:set>
</c:otherwise>
</c:choose>
<div class="product_item">
<div class="image_wrap">
<img class="img_zoom" data-zoom-image="${imageHost}${product.displayImage.url}" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="${imageHost}${product.displayImage.smallUrl}" alt="">
</div>
<div class="description">
<a class="product_title"
href="/shop/product/${fn:replace(product.productDisplayName.name, " ", "-")}/${product.id}"
title="${product.productDisplayName.name}">${product.productDisplayName.name}</a>
<div class="clearfix product_info">
<p class="product_price alignleft"><b>${price}</b></p>
<c:set value="${ratingMap.get(product.id)}" var="rating"></c:set>
<c:choose>
<c:when test="${not empty rating}">
<div class="rating-box">
<div class="rating" style="width: ${rating.rating*20}%;"></div>
</div>
</c:when>
<c:otherwise>
<div class="rating-box">
<div class="rating" style="width: 100%;"></div>
</div>
</c:otherwise>
</c:choose>
</div>
<div class="clearfix action">
<a href="/shop/product/${fn:replace(product.productDisplayName.name, " ", "-")}/${product.id}"
class="button_red middle_btn">VIEW DETAILS</a>
</div>
</div>
</div>
</c:forEach>
</div>
</div>
</div>
</div>
</c:if>
<script type="text/javascript">
jQuery().ready(function () {
$('.carousel_in_tabs.type_2, .owl_carousel.four_items').owlCarousel({
responsive: {
0: {
items: 1
},
490: {
items: 2
},
684: {
items: 3
},
992: {
items: 4
}
},
loop:true,
nav: true,
navText: [],
rtl: window.ISRTL ? true : false
});
})
</script>
點擊查看更多內容
為 TA 點贊
評論
評論
共同學習,寫下你的評論
評論加載中...
作者其他優質文章
正在加載中
感謝您的支持,我會繼續努力的~
掃碼打賞,你說多少就多少
贊賞金額會直接到老師賬戶
支付方式
打開微信掃一掃,即可進行掃碼打賞哦