java 笔记本

2018/01/14 21:28

<form>表单-----jQuery $.ajax()提交到servlet ---- 返回一个字符串给ajax 。

关键代码：

一：NewFile.jsp

<form action="#" method="post" id="form">
客户中文名称：<input type="text" name="user_ch" /></br>
客户英文名称：<input type="text" name="user_eg" /></br>
客户来源：&nbsp;<select name="choosetip">
<option>请选择</option>
<option>Wechat</option>
<option>Twitter</option>
<option>Blog</option>
</select></br>
Company ID(CID)<input type="text" name="cid" /></br>
PID&nbsp;&nbsp;<input type="text" name="pid" />&nbsp;<input type="button" id="pidCheckButton" value="验证" /></br>
<input type="submit" value="提交"/>
</form>
<script src="${pageContext.request.contextPath}/statics/js/jquery-1.7.2.min.js"></script>
<script src="${pageContext.request.contextPath}/statics/localjs/NewFile.js"></script>

二:  ForthServlet

public class ForthServlet extends HttpServlet {

protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
doPost(req, resp);
}
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//req.getRequestDispatcher("/WEB-INF/pages/NewFile.jsp").forward(req, resp);
String user_ch = req.getParameter("user_ch");
String user_eg = req.getParameter("user_eg");
String choosetip = req.getParameter("choosetip");
String cid = req.getParameter("cid");

System.out.println(choosetip);
System.out.println(req.getRequestURI());//获取ajax传过来的绝对路径
PrintWriter out = resp.getWriter();
out.write("success");
}

}

三: web.xml

[html]  view plain  copy

1. <?xml version="1.0" encoding="UTF-8"?>  
2. <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd" id="WebApp_ID" version="3.1">  
3.   <display-name>ForthServlet</display-name>  
4.   <welcome-file-list>  
5.     <span style="color:#ff0000;"><welcome-file>/WEB-INF/pages/NewFile.jsp</welcome-file></span>//这里的路径 也要注意 前面带/  
6.       
7.   </welcome-file-list>  
8.   <servlet>  
9.     <servlet-name>ForthServlet</servlet-name>  
10.     <servlet-class>com.prj.servlet.ForthServlet</servlet-class>  
11.   </servlet>  
12.   <servlet-mapping>  
13.     <servlet-name>ForthServlet</servlet-name>  
14.     <url-pattern>/ForthServlet</url-pattern>  
15.   </servlet-mapping>  
16. </web-app>  

四 ：NewFile.js

[javascript]  view plain  copy

1. $("#pidCheckButton").click(function(e){  
2.     alert("m comming");  
3.     $.ajax({  
4.         type:"POST",  
5.         url:"/ForthServlet/ForthServlet",  //路径问题  相对路径 与绝对路径  
6.         <span style="color:#ff0000;">data:$("#form").serialize(), </span>  //这里接收一下  在仔细看看是什么样子  
7.         success:function(result){  
8.             if("success" == result){  
9.                 alert("hahahahhahhaha");  
10.             }  
11.         }  
12.     })  
13.       
14. })