I have tried few way to refresh my data table after an AJAX Call, but not working.
I tried draw()
and .ajax.reload()
function, but still no luck.
Any idea how to refresh it?
here my code
HTML
<table id="transaction_data" class="table table-hover"> <thead> <tr> <th>Date Created</th> <th>User Name</th> <th>Transaction Type</th> <th>Amount (USD)</th> <th>Last Update</th> <th>Status</th> <th>Amount Coin</th> <th>Amount Coin Received</th> </tr> </thead> <tbody> <tr> </tr> </tbody> </table>
data tables script
var table = $("#transaction_data").DataTable({ processing: true, serverSide: true, ajax: '{{ url("member/deposit/data_transaction") }}', columns: [ { data: 'created_at', name: 'created_at' }, { data: 'member_id', name: 'member_id' }, { data: 'transaction_type', name: 'transaction_type' }, { data: 'amount_usd', name: 'amount_usd' }, { data: 'updated_at', name: 'updated_at' }, { data: 'status', name: 'status' }, { data: 'amount_coin_kirim', name: 'amount_coin_kirim' }, { data: 'amount_coin_terima', name: 'amount_coin_terima' } ] });
ajax script
$('#formdeposit').submit(function(e){ e.preventDefault(); if (grecaptcha.getResponse()) { var formData = { "_token": "{{ csrf_token() }}", 'deposit' : $('#deposit').val(), 'coin' : $('#coin option:selected').val() }; $.ajax({ type : 'POST', url : '{{ asset("/member/deposit/process") }}', data : formData, dataType : 'json', encode : true }) .done(function(data){ console.log(data); $('#myModal').modal('show'); // if (data.pesan=='ok') { $('#test').html(data.html); } else{ $('#test').html(data.pesan); } }); e.preventDefault(); table.draw(); //here I tried to refresh the datatable } else{ alert('Please Confirm The Captcha') } });
Advertisement
Answer
Edit: try this (For – datatable version 1.10.9)
$('#formdeposit').submit(function(e){ e.preventDefault(); if (grecaptcha.getResponse()) { var formData = { "_token": "{{ csrf_token() }}", 'deposit' : $('#deposit').val(), 'coin' : $('#coin option:selected').val() }; $.ajax({ type : 'POST', url : '{{ asset("/member/deposit/process") }}', data : formData, dataType : 'json', encode : true }) .done(function(data){ console.log(data); $('#myModal').modal('show'); // if (data.pesan=='ok') { $('#test').html(data.html); } else{ $('#test').html(data.pesan); } var table = $('#transaction_data').DataTable(); table.ajax.reload( null, false ); }); e.preventDefault(); } else{ alert('Please Confirm The Captcha') } });