wie zum senden von Formulardaten mit AJAX in der Bootstrap?

Ich habe eine web-Anwendung, die entwickelt, durch twitter bootstrap. Es ist eine JSP-Seite mit einer kleinen form, und ich brauche, um zu senden Ihre Daten zu einem Servlet ohne Neuladen der Seite. Unten ist meine form.

<!--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" method="get" action="PastSurgicalCustomItem" id="customItemForm"  onsubmit="formSubmit(); return false;">
        <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 name="customName" type="text" placeholder="" class="form-control input-md">
            </div>
          </div>


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

<!-- /add custom item -->  

Ich nachstehend eine ajax-Abfrage zum senden von Daten an das servlet. Dieser code ist auf der gleichen Seite, wo der oben genannten form auch in.

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

  function formSubmit(){

 $.ajax({
     url:'PastSurgicalCustomItem',
     data: $("#customItemForm").serialize(),
     success: function (data) {



            //alert($textbox.attr("id"));
    }
});
}
</script>

Wir geladen haben, die unter scripts die JSP-Seite als auch.

!-- Bootstrap Core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">

<!-- Custom CSS -->
<link href="css/simple-sidebar.css" rel="stylesheet">
<link href="css/custom.css" rel="stylesheet">

<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file://-->
<!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
        <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>

    <![endif]-->
<!-- jQuery -->

<script src="js/jquery.js"></script>

<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>

Unten ist mein servlet.

import DB.PastSurgicalHistoryTypeTable;
import beans.main.PastSergicalHistoryTypeBean;
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;
import javax.servlet.http.HttpSession;

/**
 *
 * @author Yohan
 */
public class PastSurgicalCustomItem extends HttpServlet {

    /**
     * Processes requests for both HTTP <code>GET</code> and <code>POST</code>
     * methods.
     *
     * @param request servlet request
     * @param response servlet response
     * @throws ServletException if a servlet-specific error occurs
     * @throws IOException if an I/O error occurs
     */
    protected void processRequest(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        response.setContentType("text/plain");  //Set content type of the response so that jQuery knows what it can expect.
        response.setCharacterEncoding("UTF-8");

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

    }


    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        processRequest(request, response);
    }


    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        processRequest(request, response);
    }


    @Override
    public String getServletInfo() {
        return "Short description";
    }

}

Das problem, das ich habe ist, dass die ajax sendet keine Daten an das servlet. Ich habe den gleichen code ohne bootstrap auch, also ich bin am überlegen, ob bootstrap hat etwas zu tun mit diesem. Wie kann ich dieses problem lösen?