jspのフォームにajaxデータを作成

Question

データパラメータをコール内に正しく作成したいと思います。

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#call').click(function() 
     { 
      $.ajax({ 
       type: "post", 
       url: "books", //this is my servlet 
       data: <<< my data here >>> 
      }); 
     }); 

    }); 
</script> 

これは私のjspの一部です：私は、通常、上記formを通過するすべてのものを渡したい

<form action="books" method="post"> 
    <table width="70%" border="1"> 
     <% 
      List<Book> books = (List<Book>) request.getAttribute("books"); 

      for (int i = 0; i < books.size(); i++) { 
     %> 
     <tr> 

      <td> 
       <input type="checkbox" name="book<%=i%>" 
         value="<%= books.get(i).getBook_id()%>"> <%= books.get(i).getName() %> 
      </td> 

     </tr> 
     <% 
      } 
     %> 
    </table> 

    <select name="user_name"> 
     <% 
      List<User> users = (List<User>) request.getAttribute("users"); 
      for (int i = 0; i < users.size(); i++) { 
     %> 
     <option value="<%=users.get(i).getName()%>"><%=users.get(i).getName()%></option> 
     <% 
      } 
     %> 
    </select> 
    <input type="submit" name="submit" value="Purchase"> 
    <input type="button" value="Call Servlet" name="Call Servlet" id="call"/> 
</form> 

。 この例では、ajaxテクノロジについて紹介してください。

Answer 1

フォームにinstance idを与え、serialize()方法

 $('#form').submit(function() 
     { 
      $.ajax({ 
       type: "post", 
       url: "books", //this is my servlet 
       data: $(this).serialize() 
      }); 
     }); 


    <form id="form" action="books" method="post"> 
     <table width="70%" border="1"> 
      <% 
       List<Book> books = (List<Book>) request.getAttribute("books"); 

       for (int i = 0; i < books.size(); i++) { 
      %> 
      <tr> 

       <td> 
        <input type="checkbox" name="book<%=i%>" 
          value="<%= books.get(i).getBook_id()%>"> <%= books.get(i).getName() %> 
       </td> 

      </tr> 
      <% 
       } 
      %> 
     </table> 

     <select name="user_name"> 
      <% 
       List<User> users = (List<User>) request.getAttribute("users"); 
       for (int i = 0; i < users.size(); i++) { 
      %> 
      <option value="<%=users.get(i).getName()%>"><%=users.get(i).getName()%></option> 
      <% 
       } 
      %> 
     </select> 
     <input type="submit" name="submit" value="Purchase"> 
     <input type="button" value="Call Servlet" name="Call Servlet" id="call"/> 
    </form>