如何通过调用servlet来填充DataTable

时间:2017-10-30 14:22:22

标签: java ajax jsp servlets datatables

我是java servlets和dataTables的新手我无法让我的java servlet执行:

我正在使用netbeans 8.2 IDE和tomcat 8.0.27以及DataTables 10.1.16

我的NetBeans结构如下所示:
Netbeans Structure

战争看起来像这样:
WAR Structure 我的index.jsp看起来像这样:

DataTable定义(在html头部分)



 <script lang='javascript'>
            $(document).ready(function () {
                $('#memberList').dataTable( {
                "processing": true,
                "serverSide": true,
                "ajax": {
                    "url": "${pageContext.request.contextPath}/SubSearch",
                    "type": "GET" 
                }

              });
              
           });
        </script>

Html Body:
&#13;
 <body>
        <h1>Member TXN Display</h1>
        <div>
            (Enter Search Criteria)<br/>
            <form action="${pageContext.request.contextPath}/SubSearch" method="post"  >
               
                <input type="text" id="SearchCritiera" style="width:322px">
                <input type="submit" value="FIND">
                <table id="memberList">
                    <thead>
                        <tr>
                            <th>Member #</th>
                            <th>Last Name</th>
                            <th>First Name</th>
                            </tr>
                    </thead>
                </table>
            </form>
        </div>
    </body>
</html>
&#13;
&#13;
&#13;

context.xml如下所示:

<?xml version="1.0" encoding="UTF-8"?>
<Context path="/MemberTXN"/>

单击“提交(查找)”按钮会调用servlet,但是,#ajax&#39;似乎根本没有打击。我在servlet中有断点,当我在&#39; Debug&#39;中运行时,我会期望它被击中。作为document.ready代码的结果模式,但没有骰子。

Servlet代码:

 package member;

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;
import com.google.gson.*;

/**
 *
 * @author Ainsworth
 */
 @WebServlet(name = "SubSearch", urlPatterns = {"/SubSearch"})
public class SubSearch 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 {


        JsonObject jMembers = new JsonObject();
        jMembers.addProperty("Echo","1");
        jMembers.addProperty("TotalRecords", 7);
        jMembers.addProperty("TotalDisplayRecords", 7);



        JsonArray data = new JsonArray();

        JsonArray row = new JsonArray();
        row.add("123456789");
        row.add("Trump");
        row.add("Donald");
        data.add(row);

        row = new JsonArray();
        row.add("123456799");
        row.add("Clinton");
        row.add("Hillary");
        data.add(row);

         row = new JsonArray();
        row.add("123456809");
        row.add("Shcumer");
        row.add("Chuck");
        data.add(row);

         row = new JsonArray();
        row.add("123456819");
        row.add("Warren");
        row.add("Elizabeth");
        data.add(row);

         row = new JsonArray();
        row.add("123456829");
        row.add("Sanders");
        row.add("Bernie");
        data.add(row);

         row = new JsonArray();
        row.add("123456839");
        row.add("DeVoss");
        row.add("Betsy");
        data.add(row);


        row = new JsonArray();
        row.add("123456849");
        row.add("Meyers");
        row.add("Seth");
        data.add(row);

        jMembers.add("Data", data);

        response.setContentType("application/Json");
        response.getWriter().print(jMembers.toString());




}


/**
 * 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";
 }

 }

以下是提交按钮的输出:

Submit Results 如果有人可以指出我的方式的错误,我会非常感激

3 个答案:

答案 0 :(得分:0)

选项1:

您可以使用ajax.dataFilter选项来更改JSON结构,因为API默认情况下需要这样的结构:

{
    "draw": 1,
    "recordsTotal": 57,
    "recordsFiltered": 57,
    "data": [{...},{...}]
}

使用dataFilter改变JSON结构:

$('#memberList').DataTable( {
    "processing": true,
    "serverSide": true,
    "ajax": {
        "url": "${pageContext.request.contextPath}/SubSearch",
        "type": "GET",
        dataFilter: function(data){
         var json = jQuery.parseJSON( data );
         json.recordsTotal = json.TotalRecords;
         json.recordsFiltered = json.TotalDisplayRecords;
         json.data = json.Data;

         return JSON.stringify( json ); // return JSON string
        }
    }

选项2:

如果您有机会更改服务器API数据结构,请使用适当的密钥构建JSON,如下所示。

jMembers.addProperty("echo","1"); //important case-sensitive
jMembers.addProperty("recordsTotal", 7);
jMembers.addProperty("recordsFiltered", 7);
jMembers.add("data", data);

还查看:

答案 1 :(得分:0)

引用Firefox:嗯,这很令人尴尬:

我终于确定我的Javascript没有被执行。问题是我的<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>错过了>

之前的</script>

现在再次感谢Gurkan,我正在执行我的服务器代码,你的帖子将帮助我确定为什么我没有填写我的表。

答案 2 :(得分:0)

您应该在doGet或doPost内进行算法