Change DataTables row colour on ajax update.

MichaelEC

Hi,

What I'm after is, is there a way to change the closest row colour after being updated through ajax?

The way our table works is, there's an edit button being called in another .php file that saves the data being changed. This works perfectly fine with DataTables although having some issues trying to change the specific rows colour once changed.

Here's our Ajax;

    $(document).on('click', '.customSave', function(event) {

        var rowID = $(this).closest('tr').index();
        var product_id = document.getElementsByName("product_id")[0].value;
        var product_name = document.getElementsByName("product_name_master")[0].value;
        
         _formurl   =   "store_product_management2.php";

        //alert(_formdata);
         $.ajax({
             url: "store_product_management2.php",
             data: {'action' : 'update_name_master', 'product_id' : product_id, 'product_name' : product_name},
             type: 'post',
             success: function(result) {
                 form_updated = true;
                    $('#tbl_products_list_master').DataTable().ajax.reload();
                 },
                     error: function() {
                         form_updated = false;
                     }
                 });
    });

So essentially, when .customSave has been pressed, change the edited row colour.

Any ideas?

colin

Hi @MichaelEC ,

As you're probably aware, ajax.reload() reloads the entire table, not just the row that's being edited. Because of that, you're going to need to remember some property of the row that was being edited, perhaps an ID column or something else. Then, you can check for that property in either rowCallback , drawCallback or createdRow and colour the row there.

Hope that helps,

Cheers,

Colin

MichaelEC

Hi @colin ,

Thanks a lot for the response, I'll try this suggestion out and update with what I manage.