Getting Started, server-side.

Getting Started, server-side.

Taylor514ceTaylor514ce Posts: 74Questions: 8Answers: 0

I've used Datatables for about 5 years, but just updated/started over, with the newest version. I went from thinking I understood datatables to feeling like a complete newb!

My server produces JSON, in the following format, which as worked, as I said, for YEARS now:

{"aaData":[
["row1 value1","row1 value2","row1 value3","row1 value4","row1 value5"],
["row2 value1","row2 value2","row2 value3","row2 value4","row2 value5"],
["row3 value1","row3 value2","row3 value3","row3 value4","row3 value5"],
]}

My HTML page:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Dashboard</title>

<link type="text/css" href="htmlFiles/NEW/datatables.css" rel="stylesheet" />

<script type="text/javascript" src="htmlFiles/NEW/jQuery-2.2.4/jquery-2.2.4.js"></script>
<script type="text/javascript" src="htmlFiles/NEW/datatables.js"></script>

<script type="text/javascript">

$(document).ready(function() {
    $('#statusLog').DataTable( {
        "processing": true,
        "serverSide": true,
        "ajax": "http://localhost:8080/fetchTemplates"
    } );
} );
</script>       
    
</head>
<body>
  <img id="imgLogo" 
    style="border:0; padding-left: 0px; padding-top:15px; padding-bottom:10px;" 
    src="/htmlFiles/logo.png" />
                
    <div id="tabsTemplates">
      <table id="statusLog">
        <thead>
        <tr>
          <th style="cursor: pointer;">Template</th>
          <th style="cursor: pointer;">Description</th>
          <th style="cursor: pointer;">Agency</th>
          <th style="cursor: pointer;">Type</th>
          <th style="cursor: pointer;">Status</th>
        </tr>
        </thead>
        <tbody></tbody>
        <tfoot>
          <tr><td></td></tr>
        </tfoot>
      </table>
    </div>
</body>
</html>

I'm getting the "500" error from the Server. I'm also getting a long query string from the request... I don't understand where that's coming from. See attached image.

Thanks in advance for reviewing and assisting.

TDG

This question has accepted answers - jump to:

Answers

  • kthorngrenkthorngren Posts: 21,147Questions: 26Answers: 4,918

    This page describes current server side behavior:
    https://datatables.net/manual/server-side

    The long string you are seeing are the parameters being sent to the server. There is a legacy mode, described on that page, which may be what you need to use.

    Kevin

  • Taylor514ceTaylor514ce Posts: 74Questions: 8Answers: 0

    Thanks for the link to the documentation. I've already reviewed that and altered my server side JSON file to respond to the additional parameters, and I'm getting the errors I've shown. I don't understand why I'm getting a "500" error; when I load the URL to the JSON producing page directly in my browser, the browser shows the JSON string.

    So my question above still stands: I need a complete, working example of how the new datatables is supposed to work with server-side data source(s).

  • hiswillpowerhiswillpower Posts: 9Questions: 1Answers: 1

    I have some questions to help me getting better understanding here.
    What does the server side processing script look like?
    What does the json produced look like?
    Does it resemble the examples?
    https://datatables.net/examples/server_side/scripts/server_processing.php

    Ted

  • Taylor514ceTaylor514ce Posts: 74Questions: 8Answers: 0

    The JSON now being returned:

    {"aaData":["draw": 1, "recordsTotal": 2, "recordsFiltered": 2, "data": ["<a href='getTemplate?id=1' target='_blank'>myTemplate.pp7</a>","Letters","Ricoh","PlanetPress Design 7","IN"],["<a href='getTemplate?id=2' target='_blank'>AddressCleansing.OL-template</a>","Sample Document for Training","Ricoh","Connect Template","IN"]]}
    

    For the server side stuff, it's coded in an environment/software platform used by the printing industry called PlanetPress, which has an HTTP Server component. You "code" by configuring a set of plugins within a "workflow process". So anything I could show you would be visual and not particularly helpful as it's not AST.NET or PHP...

    The HTTP headers are turned into XML, and then the subsequent plugins access the XML to do a database query, and output the results as JSON. This part works... if I browse directly to the JSON-producing "script", it generates the above output.

  • kthorngrenkthorngren Posts: 21,147Questions: 26Answers: 4,918
    edited July 2017

    According to https://jsonlint.com/ the response is not a valid JSON string.

    This is a valid version of your JSON data and the structure is supported by Datatables server side processing:

    {
        "draw": 1,
        "recordsTotal": 2,
        "recordsFiltered": 2,
        "data": [
            ["<a href='getTemplate?id=1' target='_blank'>myTemplate.pp7</a>", "Letters", "Ricoh", "PlanetPress Design 7", "IN"],
            ["<a href='getTemplate?id=2' target='_blank'>AddressCleansing.OL-template</a>", "Sample Document for Training", "Ricoh", "Connect Template", "IN"]
        ]
    }
    

    Kevin

  • Taylor514ceTaylor514ce Posts: 74Questions: 8Answers: 0

    Ok, when I reformat my JSON, I get the exact same error.

    Here's the output, in Chrome, from the server-side "call": JSON.PNG.

    You can see it's exactly the same as yours now, and that I'm setting the MIME type to "application/json".

    Yet when I use the URL for this page as my ajax source: error.png

  • kthorngrenkthorngren Posts: 21,147Questions: 26Answers: 4,918

    It could be that the request is being sent as using GET which has all the parameters in the URL. You might need to change to sending the request using POST to have the parameters send as JSON.

    This example shows how to use POST for the request:
    https://datatables.net/examples/server_side/post.html

    Kevin

  • allanallan Posts: 63,175Questions: 1Answers: 10,409 Site admin
    Answer ✓

    Its perhaps worth asking if you need server-side processing? Are you loading tens of thousands or more rows at a time? If yes, then stick with server-side processing. If not, then save yourself the headache and disable server-side processing :).

    Regarding the 500 error, for them always check the server's error logs. That's where the most useful information will be.

    Allan

  • Taylor514ceTaylor514ce Posts: 74Questions: 8Answers: 0

    Don't I need server-side processing in order to display new entries from the database without the user reloading the page?

  • bindridbindrid Posts: 730Questions: 0Answers: 119
    Answer ✓

    No, you can set up an ajax call on a setTimeout out side of DataTable that will go and get the newly added rows and append them to the existing data.

  • Taylor514ceTaylor514ce Posts: 74Questions: 8Answers: 0

    bindrid... that's the workaround I used in the previous version, and that's what I'm trying to avoid. I thought automatic reload was built-into the ajax call and that it required server-side processing. I'm clearly not clear on the basic theory of how datatables work.

  • Taylor514ceTaylor514ce Posts: 74Questions: 8Answers: 0

    Allan,

    Nice talking to you again... turning serverSide off did remove the problem. My data loads into the table with no errors. Still not sure why or that I understand the theory behind "server-side processing".

    My key need is for the data in the table to refresh itself. My site is a console/log display for a production system, so new events etc. are always occurring, so the data in the table is dynamic and needs to be refreshed with data from the server, behind the scenes, every few seconds.

    I also need to display tables that fetch new data in response to slightly different queries or database source tables, changes the user initiates when the user clicks a button.

    SO two needs: refresh the data automatically, periodically, and change the data source entirely when the user clicks a button.

    Is server-side processing necessary for any of this? Can this be achieved with settings in Datatables, or do I need to build "reload" and "timer" functions as in the previous version?

  • allanallan Posts: 63,175Questions: 1Answers: 10,409 Site admin
    Answer ✓

    Still not sure why or that I understand the theory behind "server-side processing".

    Instead of loading the entire data set on the client-side and then sorting, filtering and paging it on the client-side, server-side processing will have the server perform those actions. As such, DataTables will make another Ajax request for every page to display and every action taken on the table to get the data to display for the current view only.

    As such, yes, it does mean that data will update. But only with every action taken. It can't just automatically know that there is new data at the server - that would involve a WebSocket or similar.

    Is server-side processing necessary for any of this?

    No. If the data set is a manageable size, do as @bindrid says and have a setInterval that would refresh the data in the table. Even if you used server-side processing it sounds like you might need that.

    Can this be achieved with settings in Datatables, or do I need to build "reload" and "timer" functions as in the previous version?

    Correct. That is not something that is available in DataTables. It should only be 3-4 lines of external code to set the interval timer.

    Allan

This discussion has been closed.