在JSP示例上形成Ajax数据

I would like to form data parameter correctly inside ajax call.

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

    });
</script>

This is part of my jsp:

<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>

I would like to pass everything that normally passes by form above. Could you please show me around ajax technology by this example?

Give an instance id to the form and use with the serialize() method

       $('#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>