AJAX and JS-render

RobinsonHu

Hi,

I'm new to (web)dev so sorry for that. I created a database on my webserver, connected it/fetch data and render it into datatables (with images) see: http://eep.fifaplanet.eu/convertcsv.php

I just filtered the selection to ~200 entries. If I just select all entries (~20.000) the page loads for 2 minutes and needs much ressources.

I was looking around for a solution and saw each time "AJAX" and "serverside". There examples how to connect/fetch my database with AJAX but can I just render the rows with my current javascript function?
This is how I do it currently:

$(document).ready(function() {
    $('#example').DataTable( {
        "columnDefs": [
            {
                "targets": [ 0 ],
                "visible": false,
            },
            {
                "targets": [ 1 ],
                "data": "playerid",
                "render": function (data, type, row, meta) {
                return type === 'display'
                  ? '<div class="image-plus-text"><img style="width:64px" src="/Minifaces/' + row[0] + ".png" +  '"/>'+ "<br>" + data  + '</div>'
                  : data;
      }

[...]

How can I do it afterI'm using AJAX?

colin

For server side processing, enable serverSide. The protocol is discussed here. Also see examples here. For the volume of data, you'll definitely need it.

Cheers,

Colin

RobinsonHu

Thank you, colin!

But is it still possible to render the entries like I did (Image then name)? And if yes....do I need to do it in javascript or on AJAX/processing side?

allan

Absolutely you can do what you already have done with server-side processing. The columns.render function runs when the DataTable needs to get or display data for the cell. That happens event when server-side processing is enabled - so your code above for the renderer is applicable for server-side processing as well.

Allan

RobinsonHu

Thanks allan, it works now!!