使用ajax将表单数据从jsp发送到servlet答案

【问题标题】：Send form data from jsp to servlet using ajax使用ajax将表单数据从jsp发送到servlet
【发布时间】：2014-05-19 16:56:41
【问题描述】：

我花了 10 年时间编写 ASP/Ajax 并且必须切换到 JAVA。我开始编写非常简单的脚本，以便在深入研究更复杂的内容之前清楚地理解这些概念。我正在使用 Tomcat 7、Servlet 3

问题是。 servlet调用成功，但表单数据没有传输

这是编辑后的 servlet (Main.java)

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Servlet implementation class Main
 */
@WebServlet("/Main")
public class Main extends HttpServlet {
private static final long serialVersionUID = 1L;

/**
 * @see HttpServlet#HttpServlet()
 */
public Main() {
    super();
    // TODO Auto-generated constructor stub
}

/**
 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
 */
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws    ServletException, IOException {
       // TODO Auto-generated method stub
    //int ids;
    //String ids;
    //response.setContentType("text/html;charset=UTF-8");

    //PrintWriter out = response.getWriter();
    String val = request.getParameter("id");
    String name = request.getParameter("name");
    //response.getWriter().write(val);
    //response.getWriter().write("::");
    //response.getWriter().write(name);

    response.setContentType("text/plain");
    response.setCharacterEncoding("UTF-8");
    response.getWriter().write(val +" "+ name);

    //System.out.print(val);
    //if(val != null){
     //   //ids = Integer.parseInt(val);
      //  //out.print(ids);
       // out.print(val);
    //}
}
}

这是编辑后的 JSP（Main.jsp）：

<!DOCTYPE html>
<html lang="en">
<head>
    <title>SO question 4112686</title>
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>

    <script>
$.ajaxSetup({ cache: false });
$(document).ready(function() {   
$('#submit').click(function(event) {
    var form = (event.target.form),
        url = "/Main"
            + "?lName=" + escape(form.elements.lName.text)
            + "&fName=" + escape(form.elements.fName.text);

    $.get(url, function(getData) { 
        $('#somediv').text(getData);         
    });
});
});
</script>

</head>
<body>
<form id="Main" action="Main" method="post">
<h4>AJAX Demo using Jquery in JSP and Servlet</h4>
Enter your Name:
<br/><input type="text" id="fName" name="fName"/>
<br/><input type="text" id="lName" name="lName"/>
<br/><input type="submit" id="submit" value="Ajax Submit"/>
<br/>
</form>

<div id="somediv">....</div>
</body>
</html>

【问题讨论】：

标签： ajax servlets

【解决方案1】：

编辑：如果表单数据没有被传输，那是因为你没有将它发送到服务器。 GET 请求意味着您需要将lName=abc&fName=def 附加到 URL：

<script>
$.ajaxSetup({ cache: false });
    $(document).ready(function() {   
        $('#submit').click(function(event) {
            var form = (event.target.form),
                url = "/SomeServlet"
                    + "?lName=" + escape(form.elements.lName.text)
                    + "&fName=" + escape(form.elements.fName.text);

            $.get(url, function(getData) { 
                $('#somediv').text(getData);         
            });
        });
    });
</script>

【讨论】：

谢谢，谢谢，谢谢格雷格，没想到答案来得这么快。数据现在被发送到 Servlet。我注意到页面重定向到 Java 页面并显示数据。如何在不重定向页面的情况下在 --somediv-- 中显示 Servlet 输出。
附言。我将 SomeServlet 更改为 Main。 jsp 现在是 Main.jsp，java 现在是 Main.java