Advertisement
vitareinforce

WIP Load Gambar Dengan XHR dengan Auth

Apr 16th, 2019
242
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.10 KB | None | 0 0
  1. <html>
  2. <head>
  3. <title>Contoh Load</title>
  4. <link rel="stylesheet" href="node_modules/datatables/media/css/jquery.dataTables.min.css" />
  5. <script src="node_modules/jquery/dist/jquery.min.js"></script>
  6. <script src="node_modules/datatables/media/js/jquery.dataTables.min.js"></script>
  7. </head>
  8. <body>
  9. <table id="example" class="display" style="width:100%">
  10. <thead>
  11. <tr>
  12. <th>Name</th>
  13. <th>Image</th>
  14. </tr>
  15. </thead>
  16. </table>
  17. </body>
  18. <script>
  19. $(document).ready(function() {
  20. $('#example').DataTable( {
  21. ajax: {
  22. "url": "data.json",
  23. "type": "GET"
  24. },
  25. columnDefs: [
  26. {
  27. targets: 0,
  28. data: 'nama',
  29. searchable: false,
  30. orderable: false
  31. },
  32. {
  33. targets: 1,
  34. data: 'gambar',
  35. searchable: false,
  36. orderable: false,
  37. render: function (data, type, row, meta) {
  38. var currentCell = $("#example").DataTable().cells({"row":meta.row, "column":meta.col}).nodes(0);
  39. $.ajax({
  40. url: data,
  41. headers: {
  42. 'Authorization': "Basic " + btoa("username" + ":" + "password"),
  43. 'Access-Control-Allow-Origin': '*'
  44. },
  45. }).done(function () {
  46. $(currentCell).append('<img src="' + data + '" />');
  47. });
  48. return null;
  49. },
  50. },
  51. ]
  52. });
  53. } );
  54. </script>
  55. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement