Laravel & Datatables: Ajax data not refreshing table with new ajax parameters from html select

Question

can you please help me. I'm developing a back-end app using laravel where I use data tables. The situation is I'm retrieving the mailing list from mailgun and wanted to return users in that mailing list. I'm using a html select tag from the laravel blade and wanted to refresh the data table by sending the mailing list as a parameter to the ajax request but nothing happens. I followed this question

https://datatables.net/forums/discussion/30286/ajax-reload-is-not-sending-updated-params

Below is my code

LARAVEL BLADE:

Mailing List: <select id="mailing-list">
                                @foreach($lists as $list)
                                       @if($list->address == '[email protected]')
                                       <option selected="selected" value="{{$list->address}}">{{$list->address}}</option>
                                       @else
                                       <option value="{{$list->address}}">{{$list->address}}</option>
                                      @endif
                                @endforeach
                            </select>

DATA TABLE:

// get variable for mailing list
                    mailingListName = document.getElementById("mailing-list").value;
                    $('#mailing-list').change(function(){
                             table.ajax.reload();
                        });
                    // data table
                    var table = $('.data_Tables_wrapper').DataTable({
                                "bPaginate": true,
                                "bJQueryUI": true,
                                "iDisplayLength": 50,
                                "sPaginationType": "full_numbers",
                                "ajax": {
                                    url: 'lists/data',
                                    data: function ( d ) {
                                            return JSON.stringify( d.mail = mailingListName );
                                        }
                                    },
                                "order": [ 2 ],
                                "columns": [
                                    { data:"email", name: "email" },
                                    { data:"name", name: "name" },
                                    { data:"subscribed", name: "subscribed" }
                                ]
                            });

Any idea why the data table is not refreshing with the correct data.

Not related directly to your question, but you could try using yajra/laravel-datatables-oracle package. — linuxartisan
– linuxartisan, Commented Jan 14, 2017 at 3:46
@linuxartisan I don't think I can use that because the list I'm using is from mailgun api but thanks for the suggestion. — Drew
– Drew, Commented Jan 14, 2017 at 3:58

Sebastianb · Accepted Answer · 2017-01-19 18:24:59Z

2

try changing the data function in the ajax object to something like this:

"ajax": {
    url: 'lists/data',
    data: function ( d ) {
            d.mail = mailingListName;
        }
    }
}

(check the examples in the DataTable's website)

I don't know what kind of data is the server expecting on "mail", though. Also, remember datatables sends this data as a GET request.

answered Jan 19, 2017 at 18:24

Sebastianb

2,06024 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

fallen.lu · Accepted Answer · 2017-01-14 03:15:52Z

1

$('#table').dataTable().fnDestroy();
$('#table').dataTable( {
            "bDestory": true,
            bRetrieve: true});

bRetrieve: Retrieve an existing DataTables instance
bDestory: Destroy any existing table matching the selector and replace with the new options.

but in datatable documents , it becomes "destroy": true, "retrieve": true ,have a try...

answered Jan 14, 2017 at 3:15

fallen.lu

779 bronze badges

2 Comments

Drew Over a year ago

Where should i put those parameters? Inside the change function? Sorry for asking.

fallen.lu Over a year ago

var table = $('.data_Tables_wrapper').DataTable({                                  "bPaginate": true,                                 "bJQueryUI": true,                                "iDisplayLength": 50,                                 "sPaginationType": "full_numbers",                       "bDestory": true,             bRetrieve: true

Drew · Accepted Answer · 2017-01-20 07:32:05Z

1

Thank you for Sebastianb and fallen.lu for the answers. I found out why the data is not loading when the select option has changed. Instead of putting it outside the change event. I should put it inside and I get the correct data for that mailing list.

$('#mailing-list').change(function(){
                             mailingListName = document.getElementById("mailing-list").value;
                             table.ajax.reload();
                        });

answered Jan 20, 2017 at 7:32

Drew

7382 gold badges15 silver badges38 bronze badges

Collectives™ on Stack Overflow

Laravel & Datatables: Ajax data not refreshing table with new ajax parameters from html select

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related