dataTable - 表单提交后重新加载表

Question

I already read a lot here but I can´t find a working solution! I have a datatable and inside one column there is an edit button. If a user clicks on the edit button a modal appears and user can change an entry from a datatable. Once the form is submitted, the changes are done inside the database.

Now I would like to automatically refresh my table withour doing a page reload. How can I achieve that? What do I have to call inside my success message?

Here is my code:

index.php:

if ($savetodo=="true") {
    $content=array("descr"=>$descr);
    updateToDoInfo($id,$content);

}

AJAX submit:

                <script>
                    $(function() {
                        $('#form_edittodo').on(\"submit\", function(event) {
                            event.preventDefault();

                            $.ajax({
                                url: 'index.php',
                                type: 'post',
                                data: $(this).serialize(),
                                beforeSend: function(){
                                        $('#loading').show();
                                    },
                                    complete: function(){
                                        $('#loading').hide();
                                    },
                                success: function() {
                                   // What should I enter here?
                            });
                        });
                    });
                </script>

datatable:

    <script>
    $(document).ready(function() {
        $('#todolist12').DataTable();
    } );
    </script>

Would be great if someone can help me out.

Answer 1

You need to update the cell using the dataTables data() method.

For example, you might want the success function to look something like this:

success: function() { 
    $('#todolist12').DataTable().cells("#idOfChangedCell").data("Update to cell").
}

For the change to actually appear on your webpage, however, you also need to invoke the dataTables draw() method:

$('#todolist12').DataTable().draw();