Refresh DataTables from ajax

nwotech

Here is my js code

$("#rosterInfo").DataTable({
                        "dom": "t",
                        "serverSide": true,
                        "ordering": false,
                        "processing":true,
                        "ajax": {
                                "url": "php/getRoster.php",
                                "type": "POST",
                                "data": { eventID: $.urlParam('eventID') }
                        },
                        "columns": 
                                [
                                    { className: "dt-center", data: "rosterID", "defaultContent": "" },
                                    { className: "dt-center", data: "name", "defaultContent": "" },
                                    { className: "dt-center", data: "telNum", "defaultContent": "" },
                                    { className: "dt-center", data: "email", "defaultContent": "" },
                                    { className: "dt-center", data: "roomSize", "defaultContent": "" },
                                    { className: "dt-center", data: "paymentNotes", "defaultContent": "" },
                                    { className: "dt-center", data: "place", "defaultContent": "" },
                                    { className: "dt-center", data: "comments", "defaultContent": "" }
                                ],
                        "columnDefs": 
                                [
                                    { className: "dt-center",
                                        targets: [-1]
                                    }
                                ],
                        "createdRow": function( row, data, dataIndex){
                                $(row).css('background-color', data.lineColor);
            }           
                });

if I do a $("#rosterInfo").DataTable().ajax.reload(), it calls the data fetch script and received all the updated info but it doesn't display it.

Any Ideas?

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

colin

Hi @nwotech ,

Yep, that looks like it should work. Are you seeing console errors? If not, we're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

nwotech

Sure here is a link.

I am not seeing any js errors in the console.

http://travel.nwotech.ca/events.html?eventID=1

So when you click on the + to add a record. When you click add line from the form that pops up. you can see it (network tab in inspector) call the addRoster.php and then getRoster.php (being triggered by the reload statement. the new data doesn't show up in the table until i refresh the page.

colin

Hi @nwotech ,

It's because in your response you're always returning 1 for draw. This thread here gives a good description as to what it should be.

Cheers,

Colin

nwotech

I see the errors of my ways All fixed thank you very much!!