DataTables warning: table=userTable - Invalid JSON response?
Asked Answered
M

3

9

I use jQuery DataTables and get this warning message:

DataTables warning: table=userTable - Invalid JSON response

A servlet fetch users from MySQL which I want to display in a jQuery Datatable, but Ajax can't parse the JSON or the JSON is generated wrong in servlet?

Servlet:

    List<UserDTO> users = this.service.getAllUser();
                Gson gson = new Gson();
                request.setAttribute("users", gson.toJson(users));
                request.getRequestDispatcher("listAllUser.jsp").forward(request, response);

JSP:

    <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
        pageEncoding="ISO-8859-1"%>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title>Registered Users</title>
    <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
    <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <script
        src="https://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>
    <link rel="stylesheet"
        href="http://cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css" />
    <link rel="stylesheet"
        href="http://code.jquery.com/ui/1.11.4/themes/flick/jquery-ui.css">
    <script>
        $(document).ready(function() {
            $('#userTable').dataTable({
                "processing" : true,
                "serverSide" : true,
                "ajax" : {
                    "url" : "ListAllUserServlet",
                    "type" : "POST"
                },
                "columns" : [ {
                    "data" : "id"
                }, {
                    "data" : "userName"
                }, {
                    "data" : "firstName"
                }, {
                    "data" : "lastName"
                }, {
                    "data" : "email"
                }, {
                    "data" : "phone"
                }, {
                    "data" : "location"
                }, {
                    "data" : "password"
                }, {
                    "data" : "gender"
                }, {
                    "data" : "birthday"
                } ]
            });
        });
    </script>

    </head>
    <body>
        <table id="userTable" class="display">
            <thead>
                <tr>
                    <th colspan="10" id="userList">Users</th>
                </tr>
                <tr>
                    <th>User id</th>
                    <th>User name</th>
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>Email</th>
                    <th>Phone</th>
                    <th>Location</th>
                    <th>Password</th>
                    <th>Gender</th>
                    <th>Birth date</th>
                </tr>
            </thead>

            <tfoot>
                <tr>
                    <td colspan="10"><a href="index.jsp" id="toIndex">Back</a></td>
                </tr>
            </tfoot>
        </table>

    </body>
    </html>

JSON generated by servlet:

[
    {
        "id": 1,
        "userName": "userName1",
        "firstName": "firstName1",
        "lastName": "lastName1",
        "email": "[email protected]",
        "phone": "36202080085",
        "location": "location1",
        "password": "password1",
        "gender": "m",
        "birthday": "1-02-2015"
    }
]
Melamine answered 7/11, 2015 at 11:26 Comment(0)
W
10

There are couple issues with your code:

  • You have enabled server-side processing mode with "serverSide": true but your data is formatted for client-side processing mode instead. Remove "serverSide": true to use client-side processing mode.

  • You need to use dataSrc: "" ash shown below to match your JSON data format, see dataSrc for more information.

    "ajax" : {
        "url" : "ListAllUserServlet",
        "type" : "POST",
        "dataSrc": ""
    },
    
Wherry answered 7/11, 2015 at 17:42 Comment(2)
same error, But if I want to go with serverSide. so how can I. Because if I go with client-side and my data will be coming in lakes, so client browser will be not able to handle?Mayers
Given the above changes, but not worked for me. Actually, ajax response is not in datatable render format, so that I loop through the data and drew table.Data is showing in table but the above error alert also showing.Need to remove that pop up error alert.Zachariahzacharias
Z
5

Even though all data are showing correctly and also when you get this warning, it can be handled as,

$.fn.dataTable.ext.errMode = function(obj,param,err){
                var tableId = obj.sTableId;
                console.log('Handling DataTable issue of Table '+tableId);
        };
Zachariahzacharias answered 16/10, 2019 at 4:10 Comment(2)
it works because some time hitting ajax return nothing . It is indeed very help fullTownie
it's works first time, But when I use another page there are same errorAhlgren
B
0

try this

go to SYSTEM>CORE>Output.php

FROM THIS :

$elapsed = $BM->elapsed_time('total_execution_time_start', 'total_execution_time_end');

        if ($this->parse_exec_vars === TRUE)
        {
            $memory = round(memory_get_usage() / 1024 / 1024, 2).'MB';
            $output = str_replace(array('{elapsed_time}', '{memory_usage}'), array($elapsed, $memory), $output);
        }

TO THIS :

$elapsed = $BM->elapsed_time('total_execution_time_start', 'total_execution_time_end');

if (is_null($output)) {
    $output = ''; // Atau bisa menggunakan string default lainnya jika diperlukan
}

if ($this->parse_exec_vars === TRUE)
{
    $memory = round(memory_get_usage() / 1024 / 1024, 2).'MB';
    $output = str_replace(array('{elapsed_time}', '{memory_usage}'), array($elapsed, $memory), $output);
}
Beera answered 2/9, 2024 at 3:51 Comment(0)

© 2022 - 2025 — McMap. All rights reserved.