<html>
<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.24/b-1.7.0/b-html5-1.7.0/b-print-1.7.0/date-1.0.3/cr-1.5.3/r-2.2.7/rg-1.1.2/sl-1.3.3/datatables.min.css" />
<link type="text/css" href="//gyrocode.github.io/jquery-datatables-checkboxes/1.2.12/css/dataTables.checkboxes.css" rel="stylesheet" />
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.24/b-1.7.0/b-colvis-1.7.0/b-html5-1.7.0/b-print-1.7.0/cr-1.5.3/r-2.2.7/rg-1.1.2/sl-1.3.3/datatables.min.js"></script>
<!--<script type="text/javascript" src="js/datatables.min.js?r=<?=$PgVr?>"></script>-->
<script type="text/javascript" src="//gyrocode.github.io/jquery-datatables-checkboxes/1.2.12/js/dataTables.checkboxes.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.7.0/js/buttons.colVis.min.js"></script>
<meta charset=utf-8 />
<title>DataTables - JS Bin</title>
</head>
<body>
<div class="container">
<table id="example" class="display nowrap" width="100%">
</table>
</div>
</body>
</html>
body {
font: 90%/1.45em "Helvetica Neue", HelveticaNeue, Verdana, Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
color: #333;
background-color: #fff;
}
.dt-button-collection .dropdown-menu .buttons-columnVisibility:before,
.dt-button-collection .dropdown-menu .buttons-columnVisibility.active span:before {
display:block;
position:absolute;
top:1.2em;
left:0;
width:12px;
height:12px;
box-sizing:border-box;
}
.dt-button-collection .dropdown-menu .buttons-columnVisibility:before {
content:' ';
margin-top:-8px;
margin-left:10px;
border:1px solid black;
border-radius:3px;
}
.dt-button-collection .dropdown-menu .buttons-columnVisibility.active span:before {
font-family: 'Arial' !important;
content:'\2714';
margin-top: -15px;
margin-left: 12px;
text-align: center;
text-shadow: 1px 1px #fff, -1px -1px #fff, 1px -1px #fff, -1px 1px #fff;
}
.dt-button-collection .dropdown-menu .buttons-columnVisibility span {
margin-left:17px;
}
$(document).ready( function () {
let theJSON = '{"deposits":[{"id":"608ff8a4bbf2e90e4035bf39","createdOn":"2020-10-29 11:01:45","routingNo":6811780850,"accountNo":860009835,"checkNumber":957,"amount":499501,"auxOnUS":18,"itemSeqNo":361894895904,"reviewedBy":"Mcknight Mitchell","createdBy":"Walters Jackson","status":"Declined","imageFront":"front1.png","imageBack":"back2.png"},{"id":"608ff8a48b3cc0a019160a7e","createdOn":"2020-10-03 08:23:42","routingNo":6491402648,"accountNo":318253790,"checkNumber":249,"amount":238770,"auxOnUS":3,"itemSeqNo":746530562042,"reviewedBy":"Rene Guzman","createdBy":"Krista Curry","status":"Declined","imageFront":"front1.png","imageBack":"back2.png"},{"id":"608ff8a4c90acfeab969f9a4","createdOn":"2020-07-11 03:31:50","routingNo":7720171666,"accountNo":151669401,"checkNumber":223,"amount":907,"auxOnUS":33,"itemSeqNo":348065022697,"reviewedBy":"Jennifer Humphrey","createdBy":"Daisy Ayala","status":"Declined","imageFront":"front2.png","imageBack":"back2.png"},{"id":"608ff8a45ef9ee5a70d27b3b","createdOn":"2020-08-20 01:37:17","routingNo":3343636849,"accountNo":570565240,"checkNumber":266,"amount":352580,"auxOnUS":12,"itemSeqNo":439947831921,"reviewedBy":"Hines Wyatt","createdBy":"Stacey Barry","status":"Declined","imageFront":"front2.png","imageBack":"back1.png"},{"id":"608ff8a443e26df8ee6011ae","createdOn":"2021-04-28 12:10:00","routingNo":7269137516,"accountNo":589745054,"checkNumber":198,"amount":490469,"auxOnUS":13,"itemSeqNo":707377381668,"reviewedBy":"Johnnie Cox","createdBy":"Nanette Becker","status":"Declined","imageFront":"front1.png","imageBack":"back2.png"},{"id":"608ff8a49f493a227b102e17","createdOn":"2021-02-04 12:21:49","routingNo":4498310462,"accountNo":490336699,"checkNumber":192,"amount":825574,"auxOnUS":16,"itemSeqNo":119938758772,"reviewedBy":"Alisha Foley","createdBy":"Ericka Martin","status":"In Review","imageFront":"front2.png","imageBack":"back2.png"},{"id":"608ff8a4df2f3ccc60fd8b37","createdOn":"2020-11-16 05:17:52","routingNo":1650775865,"accountNo":459400668,"checkNumber":104,"amount":689368,"auxOnUS":34,"itemSeqNo":824227189550,"reviewedBy":"Bullock Delgado","createdBy":"Austin Galloway","status":"Posted","imageFront":"front1.png","imageBack":"back1.png"},{"id":"608ff8a44fc36a36d4fc1bab","createdOn":"2021-04-06 12:54:39","routingNo":4501941657,"accountNo":460467103,"checkNumber":446,"amount":900032,"auxOnUS":3,"itemSeqNo":657090140868,"reviewedBy":"Hubbard Riley","createdBy":"Lorrie Lancaster","status":"Declined","imageFront":"front2.png","imageBack":"back2.png"},{"id":"608ff8a4a6e508b4abce16e0","createdOn":"2020-07-23 12:19:29","routingNo":9846402635,"accountNo":429754821,"checkNumber":291,"amount":451883,"auxOnUS":32,"itemSeqNo":947616489704,"reviewedBy":"Erin Pacheco","createdBy":"French Lucas","status":"Posted","imageFront":"front2.png","imageBack":"back1.png"},{"id":"608ff8a400f5516c1d8c515c","createdOn":"2020-09-09 11:50:17","routingNo":9320087999,"accountNo":110515528,"checkNumber":344,"amount":998093,"auxOnUS":37,"itemSeqNo":440993358483,"reviewedBy":"Dionne Wells","createdBy":"Craft Armstrong","status":"In Review","imageFront":"front1.png","imageBack":"back2.png"}]}';
let inJSON = JSON.parse(theJSON).deposits;
let tempTable = $('#example').DataTable({
data: inJSON,
order: [[1, "asc"]],
dom: "<'row'<'col-sm-12 col-md-4'<'row'<'#ColVisHolder.col-sm-12 col-md-2 col-lg-1'><'col-sm-12 col-md-10 col-lg-11'l>>><'col-sm-12 col-md-4 text-center'B><'col-sm-12 col-md-4'f>>" +
"<'row'<'col-sm-12'tr>>" +
"<'row mt-3'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'p>>",
columnDefs: [{
targets: 0,
checkboxes: {
'selectRow': true
}
}],
colReorder: true,
stateSave: true,
buttons:[
{
extend: 'colvis',
columns: [1, 2, 3, 4, 5, 6, 7, 8]
},
{
extend: 'collection',
text: 'Actions',
name: 'Actions',
enabled: false,
autoClose: true,
buttons: [
{
text: 'Add to My List',
action: function(e, dt, node, config){
AddDocsToMyList();
}
},
{
text: 'Combine',
action: function(e, dt, node, config){
CombineDocs();
}
},
{
text: 'Delete',
action: function(e, dt, node, config){
$('#DeleteSelectedDocsModal').modal('show');
}
},
{
extend: 'pdf',
text: 'Download'
},
{
extend: 'print',
text: 'Print'
},
{
text: 'Upload',
action: function(e, dt, node, config){
UploadDocs();
}
}
]
},
{
text: "Refine Search",
action: function(e, dt, node, config){
ShowRefineSearchModal();
}
},
{
extend: "selected",
text: "View",
action: function(e, dt, node, config){
ViewSelectedDocs();
}
}
],
language:{
search: "_INPUT_",
searchPlaceholder: "Find in Results...",
},
pagingType: "full",
//paging: false,
responsive: {
details: {
type: 'column',
target: 0
}
},
select: {
style: 'multi',
selector: 'td:first-child'
},
columns: [
{tile: null, data: null},
{title: "Created On", data: "createdOn"},
{title: "Account", data: "accountNo"},
{
title: "Amount",
data: "amount",
render: function(data, type, row, meta){
return $.fn.dataTable.render.number( ',', '.', 2, '$' ).display(data/100);
}
},
{title: "AuxOnUS", data: "auxOnUS"},
{title: "ItemSeqNo", data: "itemSeqNo"},
{title: "Reviewed By", data: "reviewedBy"},
{title: "Item Status", data: "status"},
{title: "Created By", data: "createdBy"}
]
});
} );
You can jump to the latest bin by adding /latest
to your URL
Shortcut | Action |
---|---|
ctrl + [num] | Toggle nth panel |
ctrl + 0 | Close focused panel |
ctrl + enter | Re-render output. If console visible: run JS in console |
Ctrl + l | Clear the console |
ctrl + / | Toggle comment on selected lines |
ctrl + [ | Indents selected lines |
ctrl + ] | Unindents selected lines |
tab | Code complete & Emmet expand |
ctrl + s | Save & lock current Bin from further changes |
ctrl + shift + s | Clone Bin |
ctrl + y | Archive Bin |
Complete list of JS Bin shortcuts |
URL | Action |
---|---|
/ | Show the full rendered output. This content will update in real time as it's updated from the /edit url. |
/edit | Edit the current bin |
/watch | Follow a Code Casting session |
/embed | Create an embeddable version of the bin |
/latest | Load the very latest bin (/latest goes in place of the revision) |
/[username]/last | View the last edited bin for this user |
/[username]/last/edit | Edit the last edited bin for this user |
/[username]/last/watch | Follow the Code Casting session for the latest bin for this user |
/quiet | Remove analytics and edit button from rendered output |
.js | Load only the JavaScript for a bin |
.css | Load only the CSS for a bin |
Except for username prefixed urls, the url may start with http://jsbin.com/abc and the url fragments can be added to the url to view it differently. |