Rows close when Ajax updates

Rows close when Ajax updates

agentas22agentas22 Posts: 4Questions: 0Answers: 0

Hello,

I am having some trouble with Datatables. I have connected a datatable to a Mysql database via Ajax. It is set to update every second. The problem is, when Ajax upadates the table is redrawn and the rows which were open then close. Since this happens really quick it looks like the system is glitching. Is there a way around this?

Thank you!

Replies

  • kthorngrenkthorngren Posts: 20,142Questions: 26Answers: 4,736

    There are multiple ways to refresh the Datatables table. Please provide your code so we can see how you are doing this.

    rows which were open then close

    Does this mean they are removed from the table or just from the display and remain in the table.

    Kevin

  • agentas22agentas22 Posts: 4Questions: 0Answers: 0

    Thank you for your respone!

    I attached a screenshot of what I mean about the rows closing.

    Here`s the way I am refreshing the table via Ajax. The "server_processing.php" file is the same that Datatables provide in their example(https://datatables.net/examples/server_side/simple.html).

            var table = $('#vilkikai').DataTable( {
                responsive: true,
                ajax: "server_processing.php",
                language: {
                    "lengthMenu": "Rodyti _MENU_ vilkikų per puslapį",
                    "emptyTable": "Nėra duomenų",
                    "zeroRecords": "Nieko nerasta",
                    "loadingRecords": "Kraunama...",
                    "processing": "Apdorojama...",
                    "search": "Ieškoti:",
                    "paginate": {
                        "next": "Kitas",
                        "previous": "Atgal"
                    },
                    "info": "",
                    "infoEmpty": "",
                    "infoFiltered": ""
                }
            } );
             
            setInterval( function() {
                table.ajax.reload();
            }, 1000);
    

    Thank you very much!

  • kthorngrenkthorngren Posts: 20,142Questions: 26Answers: 4,736
    edited July 2017

    I see the child row(s) are closed. I'm not sure if this will affect child row display but you could try the reloading using the options in the second example here:
    https://datatables.net/reference/api/ajax.reload()#Examples

    Setting the second parameter false keeps the current paging position. Might keep the child row open.

    Another option is to just get new data from the table then use rows.add(newData).draw(false); where newData is a variable containing the updated data.

    Kevin

  • agentas22agentas22 Posts: 4Questions: 0Answers: 0

    Yeah, I have tried both of those methods. First one definitely doesn`t help in this situation. The second one just adds new rows every Ajax update, however the child rows do retain their positions.

    Would you have any other ideas?

  • kthorngrenkthorngren Posts: 20,142Questions: 26Answers: 4,736

    Your preference is to use ajax.reload() instead of rows.add().draw(false) even though adding the new rows keeps the child row open?

    @allan will need to follow up with ajax.reload() and if its expected that the child rows stay open.

    Kevin

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin

    No they won't automatically since they are in theory new rows inside the DataTable (i.e. you've deleted the old ones, and then added new ones, so there is nothing to inherit).

    You'd need to have some external code that would register what rows have child rows displayed (preXhr) and then display them again on the next draw.

    This is how Responsive does exactly that.

    Allan

  • agentas22agentas22 Posts: 4Questions: 0Answers: 0

    Thank you guys! It is working now.

This discussion has been closed.