<div class="card-body"> <div class="table-responsive"> <table class="display dataTable no-footer" id="notificationTable" role="grid" aria-describedby="basic-1_info"> <thead> <tr> <th>ID</th> <th> Title</th> <th> Brief</th> <th>Category</th> <th>To</th> <th>By</th> <th>Edit</th> <th>Delete</th> </tr> </thead> <tbody> <tr> </tr> </tbody> </table> </div> </div> let notificationTable = $('#notificationTable').DataTable({ "processing": true, // 'scrollX': true, "serverSide": true, "ordering": false, dom: 'Bfrtip', buttons: [{ extend: 'copy', exportOptions: { columns: '0,1,3,4' } }, { text: 'CSV', className: "csvGenerate", action: function (e, dt, node, config) { getCSVFile(); } }, { text: 'Excel', className: "excelMyButtonsToHide", action: function (e, dt, node, config) { getExcelFile(); } }, { extend: 'print', exportOptions: { columns: '0,1,3,4' } }, 'colvis'- ], language: { buttons: { colvis: '<span class="icon icon-eye" style="font-size: x-small;"/>' } }, 'columnDefs': [{ "visible": false, "targets": [] }], "ajax": { "url": '/system/admin/notifications/allNotifications?fromDate='+ fromStart +'&toDate=' +endDate +'&orderCol=' + ord + '&column=' + col, "type": "GET", dataFilter: function (data) { responseData = jQuery.parseJSON(data); notificationData = responseData.data; return JSON.stringify(responseData); } }, "columns": [{ "data": "id" }, { "data": "offerTitle" }, { "data": "offerBrief" }, { "data": "offerCategory" }, { "data": "offerTo" }, { "data": "offerBy" }, { sortable: false, "render": function (data, type, full) { let buttonID = "edit_" + full.id; return '<a id=' + buttonID + ' class="icofont icofont-edit edit"></a>'; } }, { sortable: false, "render": function (data, type, full) { let buttonID = "delete_" + full.id; return '<a id=' + buttonID + ' class=" icofont icofont-trash trash"></a>'; } }, ], }); $('#notificationTable').on('click', 'a.trash', function (row) { let rowId = row.target.id; selectedId = rowId.split('_')[1] Swal.fire({ title: 'Are you sure?', text: "You won't be able to revert this!", icon: 'warning', showCancelButton: true, confirmButtonColor: '#3085d6', cancelButtonColor: '#d33', confirmButtonText: 'Yes, delete it!' }).then((result) => { if (result.isConfirmed) { axios.delete(`/system/admin/notifications/${selectedId}`).then (function (response){ $("#addCashback").text("Add").prop('disabled',false) if (true){ //if (response.data.success){ $("#addNewNotification").modal("hide") notificationTable.draw(true) notify("Success","Data Saved successfully","success") } else{ notify("Error",response.data.errors,"danger") } }) Swal.fire( 'Deleted!', 'Your file has been deleted.', 'success' ).then(function() { notificationTable.draw(true); }); } }) });
Browser support:
Refreshes the contents and visual appearance of the current table.
Syntax:
Return value:
This method has no return value.
Example HTML code 1:
This example illustrates the use of the refresh method:
<head> <style> .ruleToRemove { color:#FF0000; } </style> <script type="text/javascript"> function RemoveRule () { // removes the ruleToRemove style rule that affects the table var style = document.styleSheets[0]; style.removeRule (0); // refreshes the table var table = document.getElementById ("myTable"); table.refresh (); } </script> </head> <body> <button title="RemoveRule ();">Remove a rule and refresh the table!</button> <table id="myTable" border="1px" class="ruleToRemove"> <tbody> <tr> <td>First row.</td> </tr> <tr> <td>Second row.</td> </tr> </tbody> </table> </body> |
Did you find this example helpful? yes no |
Supported by objects:
Related pages:
External links:
User Contributed Comments