2015-02-23 68 views
0

我正尝试使用JQuery/Ajax将一些数据从JSP发送到Servlet。以下是我的JSP文件的重要内容。无法使用jQuery将数据从JSP传递到Servlet

script src="http://code.jquery.com/jquery-latest.min.js"></script> 
<script> 
    var form = $('#customItemForm'); 
    form.submit(function() { 

    $.ajax({ 
     type: form.attr('method'), 
     url: form.attr('action'), 
     data: form.serialize(), 
     success: function (data) { 


     } 
    }); 

    return false; 
}); 
</script> 

<!--add custom item --> 

<div class="modal fade" id="customItemModel" tabindex="-1" role="dialog" aria-labelledby="basicModal" aria-hidden="true"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> <a href="#" data-dismiss="modal"> <img src="images/arrow-back-512.png" width="30px" height="30px"> <small>Back</small></a> <span id="myModalLabel" style="margin-left:20px;"><font size="+2"><b>Add Custom Item</b></font></span> </div> 
     <div class="modal-body"> 
      <form class="form-horizontal" name="customItemForm" method="post" action="PastSurgicalCustomItem"> 
     <fieldset id="modal_form"> 

      <!-- Text input--> 
      <div class="form-group"> 
      <label class="col-md-1 control-label" for="textinput">Name</label> 
      <div class="col-md-8"> 
       <input id="customName" name="customName" type="text" placeholder="" class="form-control input-md"> 
      </div> 
      </div> 


      <div class="modal-footer"> 
       <input type="submit" id="additional" class="btn btn-primary" data-dismiss="modal" value="Submit"> 
      <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> 
      </div> 
     </fieldset> 
     </form> 
    </div> 
    </div> 
</div> 

<!-- /add custom item --> 

下面是Servlet类

import java.io.IOException; 
import java.io.PrintWriter; 
import javax.servlet.ServletException; 
import javax.servlet.http.HttpServlet; 
import javax.servlet.http.HttpServletRequest; 
import javax.servlet.http.HttpServletResponse; 

public class PastSurgicalCustomItem extends HttpServlet { 


    protected void processRequest(HttpServletRequest request, HttpServletResponse response) 
      throws ServletException, IOException { 
     response.setContentType("text/html;charset=UTF-8"); 
     PrintWriter out = response.getWriter(); 

      String customName = request.getParameter("customName"); 
      System.out.println(customName); 

    } 

    // <editor-fold defaultstate="collapsed" desc="HttpServlet methods. Click on the + sign on the left to edit the code."> 
    /** 
    * Handles the HTTP <code>GET</code> method. 
    * 
    * @param request servlet request 
    * @param response servlet response 
    * @throws ServletException if a servlet-specific error occurs 
    * @throws IOException if an I/O error occurs 
    */ 
    @Override 
    protected void doGet(HttpServletRequest request, HttpServletResponse response) 
      throws ServletException, IOException { 
     processRequest(request, response); 
    } 

    /** 
    * Handles the HTTP <code>POST</code> method. 
    * 
    * @param request servlet request 
    * @param response servlet response 
    * @throws ServletException if a servlet-specific error occurs 
    * @throws IOException if an I/O error occurs 
    */ 
    @Override 
    protected void doPost(HttpServletRequest request, HttpServletResponse response) 
      throws ServletException, IOException { 
     processRequest(request, response); 
    } 

    /** 
    * Returns a short description of the servlet. 
    * 
    * @return a String containing servlet description 
    */ 
    @Override 
    public String getServletInfo() { 
     return "Short description"; 
    }// </editor-fold> 

} 

但是servlet的不打印的价值,这意味着JQuery的没有通过任何东西。我在这里做错了什么?

+2

当您按名称$('form [name =“customItemForm”]')选择它时,您正在通过ID选择您的表单。或者给表单一个id。 – 2015-02-23 09:38:18

+0

@DavidMaes:不好。 – 2015-02-23 09:47:04

回答

0

在你设置一个断点doGet方法和步骤通过代码,看它是否根本没有执行或者它是否被执行,但引发异常。 (例如,通过查看所有现代浏览器中可用的开发人员视图中的网络连接)并查看返回的AJAX调用的标头和内容。

+0

方法是post,所以doPost会被调用。 – Prashant 2015-02-23 09:59:23

+1

jQuery使用[默认情况下为GET请求AJAX](http://api.jquery.com/jquery.ajax/#sending-data-to-server)。 – Seb 2015-02-23 10:58:13

+0

我明白了,但他指定了post方法。 – Prashant 2015-02-23 11:03:56