从jsp中得到搜索输入的内容，进入后台查询；显示在页面中，页面局部刷新

用到了jQuery

 

页面中内容：

<div class="clmMain">
         <dl class="packageTitle">
             <dt>省<s:select cssClass="xiala" list="provinces" name="province.pname" listKey="pname" listValue="pname" onchange="getsort3()"></s:select></dt>
                <dd class="city">市<s:select cssClass="xiala" list="cities" name="city.cname" listKey="cname" listValue="cname" ></s:select></dd>
                <dd class="brand">品牌<s:select cssClass="xiala" list="tc_Brands" name="tc_Brand.tc_BrandName" listKey="tc_BrandName" listValue="tc_BrandName" ></s:select></dd>
                <dd class="type">类型<s:select cssClass="xiala" list="tc_Types" name="tc_Type.typeName" listKey="typeName" listValue="typeName" ></s:select></dd>
                <dd class="search">关键字<input name="tctext" type="text" class="searchBox" /><a href="javascript:;" onclick="getsort4();"><input name="" type="image" src="<%=basePath%>images/searchBtn.gif" class="searchBtn" /></a>
                </dd>
                <dd class="clear"></dd>
            </dl>
   <dl class="searchMes searchMesTitle">
              <dt class="txt_green">省</dt>
                <dd class="SMcity txt_green">市</dd>
                <dd class="SMbrand txt_green">品牌</dd>
                <dd class="SMtype txt_green">类型</dd>
                <dd class="SMpackage txt_green">套餐信息</dd>
                <dd class="clear"></dd>
             </dl>
  <div class="search_info">
    <div class="resultForEach">
    <c:if test="${tc_Datas!=null}">
            <c:forEach items="${tc_Datas}" var="tc_Data" varStatus="st">
   <dl <c:if test="${!(st.count%2==0)}"> style="background-color: #c1ddaa" </c:if> class="searchMes" id="${tc_Data.tcId }">
              <dt  class="txt_gray">${tc_Data.province }</dt>
                <dd class="SMcity txt_gray">${tc_Data.city }</dd>
                <dd class="SMbrand txt_gray">${tc_Data.brand }</dd>
                <dd class="SMtype txt_gray">${tc_Data.type }</dd>
                <dd class="SMpackage"><a class="txt_gray" href="http://bbs.wali.com.cn/thread-${tc_Data.tid}-1-1.html">${tc_Data.tcName }</a></dd>
                <dd class="clear"></dd>
             </dl>
   
   </c:forEach>
   </c:if>
    </div>
  </div>

 

JavaScript内容：

<script type="text/javascript">

function getsort4(){  
    var pname=$("select[name=province.pname]").val(); 
    var cname=$("select[name=city.cname]").val();
    var tc_BrandName=$("select[name=tc_Brand.tc_BrandName]").val();
    var typeName=$("select[name=tc_Type.typeName]").val();
    var tctext=$("input[name=tctext]").val();
    //var url="pname="+pname+"cname="+cname+"tc_BrandName="+tc_BrandName+"typeName="+typeName;
    //alert(url);
    $.ajax({  
        cache:false,  
        url:'ajaxFindSort4.action',  
        type:'post',  
        data:{"pname":pname,"cname":cname,"tc_BrandName":tc_BrandName,"typeName":typeName,"tctext":tctext},
        success: function(msg){
     $("div.resultForEach").html(msg);
     display_flag = true;
  }
    });
}

 

</script>

 

<!--  首页Ajax查询检索内容-->
     <action name="ajaxFindSort4" class="www.wali.action.TC_DateAction" method="ajaxFindSort4">
       <result name="msg">/jsp/resultForEach.jsp
       </result>
     </action>

action中：return为msg；

public String ajaxFindSort4(){
  System.out.println(this.getCname()+this.getPname()+this.getTc_BrandName()+this.getTypeName()+this.getTctext());
  if(this.getTctext().equals("")){
   tc_Datas = tc_DataServince.
       findDateByProvinceAndCityAndBrandAndType10(this.getPname(), this.getCname(), this.getTc_BrandName(), this.getTypeName());
  }else{
   //关键字搜索不为空
   tc_Datas = tc_DataServince.
       findDateByProvinceAndCityAndBrandAndTypeAndTctext10(this.getPname(), this.getCname(), this.getTc_BrandName(), this.getTypeName(),this.getTctext());
  }
  
//  tc_Datas = tc_DataServince.find10Data();
  return "msg";
 }

 

struts.xml中

name为msg；result中为/jsp/resultForEach.jsp

<result name="msg">/jsp/resultForEach.jsp
       </result>

resultForEach.jsp中页面就是一个页面，Ajax会取其中的body内容

 

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ page isELIgnored="false"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
   
    <title>My JSP 'resultForEach.jsp' starting page</title>
   
 <meta http-equiv="pragma" content="no-cache">
 <meta http-equiv="cache-control" content="no-cache">
 <meta http-equiv="expires" content="0">   
 <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
 <meta http-equiv="description" content="This is my page">
 <!--
 <link rel="stylesheet" type="text/css" href="styles.css">
 -->
<link href="<%=basePath %>style/global.css" rel="stylesheet" type="text/css" />
<link href="<%=basePath %>style/layout.css" rel="stylesheet" type="text/css" />
<link href="<%=basePath %>style/text.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<%=basePath %>/script/flashobject.js"></script>
<script type="text/javascript" src="<%=basePath %>/script/jquery-1.2.6.js"></script>
  </head>
 
  <body>
 <c:if test="${tc_Datas!=null}">
    <c:forEach items="${tc_Datas}" var="tc_Data"  varStatus="st">
   <dl <c:if test="${!(st.count%2==0)}"> style="background-color: #c1ddaa" </c:if>  class="searchMes" id="${tc_Data.tcId }">
              <dt class="txt_gray">${tc_Data.province }</dt>
                <dd class="SMcity txt_gray">${tc_Data.city }</dd>
                <dd class="SMbrand txt_gray">${tc_Data.brand }</dd>
                <dd class="SMtype txt_gray">${tc_Data.type }</dd>
                <dd class="SMpackage"><a class="txt_gray" href="http://bbs.wali.com.cn/thread-${tc_Data.tid}-1-1.html">${tc_Data.tcName }</a></dd>
                <dd class="clear"></dd>
             </dl>
   </c:forEach>
  </c:if>
 <c:if test="${empty tc_Datas}">
  <dl class="searchMes"> <dd class="SMpackage txt_gray">没有更新与此相关的套餐信息</dd></dl>
 </c:if>
  </body>
</html>