Skip to content

Instantly share code, notes, and snippets.

@grekodev
Last active July 19, 2019 23:05
Show Gist options
  • Select an option

  • Save grekodev/033966c97ee57930e9fb2617a212512d to your computer and use it in GitHub Desktop.

Select an option

Save grekodev/033966c97ee57930e9fb2617a212512d to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>datatable</title>
<link
rel="stylesheet"
href="http://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css"
/>
</head>
<body>
<table id="table_id" class="display"></table>
<button id="customerSearchButton">CLICK AQUI - WACHIN (RECARGAR)</button>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="http://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script>
$(document).ready(function() {
let table = $("#table_id").DataTable({
columns: [{ data: "id" }, { data: "name" }, { data: "email" }],
rowCallback: function(row, data) {},
filter: true,
info: false,
ordering: false,
processing: true,
retrieve: true
});
$("#customerSearchButton").on("click", function(event) {
$.ajax({
url: "https://jsonplaceholder.typicode.com/comments?postId=1",
type: "get"
})
.done(function(result) {
console.log(result);
table.clear().draw();
table.rows.add(result).draw();
})
.fail(function(jqXHR, textStatus, errorThrown) {
// needs to implement if it fails
});
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment