Tmall_Fore_search

分类页面完了,然后就是搜索页面

Tmall_Fore_search

感觉有点类似排序那一块。通过search方法,把带某个关键字的products全部填充到C里面,然后展示出来。

search.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false"%>
 
    <a href="${contextPath}">
        <img id="logo" src="img/site/logo.gif" class="logo">
    </a>
     
    <form action="foresearch" method="post" >
        <div class="searchDiv">
            <input name="keyword" type="text" value="${param.keyword}" placeholder="时尚男鞋  太阳镜 ">
            <button  type="submit" class="searchButton">搜索</button>
            <div class="searchBelow">
                <c:forEach items="${cs}" var="c" varStatus="st">
                    <c:if test="${st.count>=5 and st.count<=8}">
                        <span>
                            <a href="forecategory?cid=${c.id}">
                                ${c.name}
                            </a>
                            <c:if test="${st.count!=8}">             
                                <span>|</span>             
                            </c:if>
                        </span>          
                    </c:if>
                </c:forEach>     
            </div>
        </div>
    </form>  

以及简单的search页面simpleSearch.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false"%>
 
<div >
    <a href="${contextPath}">
        <img id="simpleLogo" class="simpleLogo" src="img/site/simpleLogo.png">   
    </a>
 
    <form action="foresearch" method="post" >
    <div class="simpleSearchDiv pull-right">
        <input type="text" placeholder="平衡车 原汁机"  value="${param.keyword}" name="keyword">
        <button class="searchButton" type="submit">搜天猫</button>
        <div class="searchBelow">
            <c:forEach items="${cs}" var="c" varStatus="st">
                <c:if test="${st.count>=8 and st.count<=11}">
                    <span>
                        <a href="forecategory?cid=${c.id}">
                            ${c.name}
                        </a>
                        <c:if test="${st.count!=11}">            
                            <span>|</span>             
                        </c:if>
                    </span>          
                </c:if>
            </c:forEach>         
        </div>
    </div>
    </form>
    <div style="clear:both"></div>
</div>

然后是search方法

public String search(HttpServletRequest request, HttpServletResponse response, Page page){
    String keyword = request.getParameter("keyword");
    List<Product> ps= new ProductDAO().search(keyword,0,20);
    productDAO.setSaleAndReviewNumber(ps);
    request.setAttribute("ps",ps);
    return "searchResult.jsp";
}  

然后跳转页面searchResult.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false"%>
 
<%@include file="include/header.jsp"%>
<%@include file="include/top.jsp"%>
<%@include file="include/search.jsp"%>
<%@include file="include/searchResultPage.jsp"%>
<%@include file="include/footer.jsp"%>

包含

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false"%>
     
<div id="searchResult">
     
    <div class="searchResultDiv">
        <%@include file="productsBySearch.jsp"%>
    </div>
 
</div>

再包含productsBySearch.jsp

1. 遍历ps,把每个产品的图片,价格,标题等信息显示出来
2. 如果ps为空,则显示 "没有满足条件的产品"

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isELIgnored="false"%>
     
<div class="searchProducts">
     
    <c:forEach items="${ps}" var="p">
        <div class="productUnit" price="${p.promotePrice}">
            <a href="foreproduct?pid=${p.id}">
                <img class="productImage" src="img/productSingle/${p.firstProductImage.id}.jpg">
            </a>
            <span class="productPrice">¥<fmt:formatNumber type="number" value="${p.promotePrice}" minFractionDigits="2"/></span>
            <a class="productLink" href="foreproduct?pid=${p.id}">
             ${fn:substring(p.name, 0, 50)}
            </a>
             
            <a class="tmallLink" href="foreproduct?pid=${p.id}">天猫专卖</a>
 
            <div class="productInfo">
                <span class="monthDeal ">月成交 <span class="productDealNumber">${p.saleCount}笔</span></span>
                <span class="productReview">评价<span class="productReviewNumber">${p.reviewCount}</span></span>
                <span class="wangwang"><img src="img/site/wangwang.png"></span>
            </div>
             
        </div>
    </c:forEach>
    <c:if test="${empty ps}">
        <div class="noMatch">没有满足条件的产品<div>
    </c:if>
     
        <div style="clear:both"></div>
</div>