File
Login or Register via GitHub
<html> <head> <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script> <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.3.0/css/bootstrap.min.css" rel="stylesheet"> <link href="https://nightly.datatables.net/css/dataTables.bootstrap5.css" rel="stylesheet" type="text/css" /> <script src="https://nightly.datatables.net/js/dataTables.js"></script> <script src="https://nightly.datatables.net/js/dataTables.bootstrap5.js"></script> <link href="https://nightly.datatables.net/fixedcolumns/css/fixedColumns.bootstrap5.css" rel="stylesheet" type="text/css" /> <script src="https://nightly.datatables.net/fixedcolumns/js/dataTables.fixedColumns.js"></script> <script src="https://nightly.datatables.net/fixedcolumns/js/fixedColumns.bootstrap5.js"></script> <meta charset=utf-8 /> <title>DataTables - JS Bin</title> </head> <body> <div class="container"><table id="test" class="table table-bordered table-hover table-striped dataTable no-footer" style="width: 2475.53px; margin-left: 0px;" cellpadding="0" cellspacing="0" border="0"> <thead> <tr> <th>DA</th> <th>VESSEL</th> <th>L/D</th> <th>BERTH/PORT</th> <th>ACTIVITY</th> <th>PRODUCTS</th> <th>STATUS</th> <th>MONTH/YEAR</th> <th>ETB</th> <th>ETD</th> <th>ARR</th> <th>SAE</th> <th>MAN</th> <th>BL/MAN</th> <th>INF/DIS</th> <th>OWNER</th> <th>CHARTERER</th> <th>SUPPLIER</th> <th>OPERATOR</th> <th>ISPS</th> <th>FR</th> <th>PAY</th> <th>EDIT</th> <th>DELETE</th> </tr> </thead></table> </div> </body></html>var data = { "data": [ [ "DV2002", "MT TEST", "", "NODEF / NODEF", "OTHER", "", "ETA / FEB-02-2024 ", "FEB 2024", "", "FEB-02-2024 ", "NO", "NO", "NO", "NO", "NO", "**UNDEFINED**", "**UNDEFINED**", "**UNDEFINED**", "", "NO", "NO", "NO", "<button type=\"button\" name=\"update\" id=\"9809\" class=\"btn btn-warning btn-xs update\"><i class=\"bi bi-pencil-square\"></i></button>", "<button type=\"button\" name=\"delete\" id=\"9809\" class=\"btn btn-danger btn-xs delete\" ><i class=\"bi bi-trash3\"></i></button>" ], [ "13200", "MV BRAYTOSHIP", "", "NODEF / NODEF", "OTHER", "", "ETA / FEB-02-2024 ", "FEB 2024", "", "FEB-02-2024 ", "NO", "NO", "NO", "NO", "NO", "**UNDEFINED**", "**UNDEFINED**", "**UNDEFINED**", "", "NO", "NO", "NO", "<button type=\"button\" name=\"update\" id=\"9808\" class=\"btn btn-warning btn-xs update\"><i class=\"bi bi-pencil-square\"></i></button>", "<button type=\"button\" name=\"delete\" id=\"9808\" class=\"btn btn-danger btn-xs delete\" ><i class=\"bi bi-trash3\"></i></button>" ], [ "13179", "STI YORKVILLE", "", "POZOS / STM", "COASTVOY", "", "ETA / JUL-31-2023 ", "JUL 2023", "TBC", "AUG-01-2023 ", "NO", "NO", "NO", "NO", "NO", "SCORPIO", "ECOPETROL", "CABOTAGE OUT", "FC", "NO", "NO", "NO", "<button type=\"button\" name=\"update\" id=\"9786\" class=\"btn btn-warning btn-xs update\"><i class=\"bi bi-pencil-square\"></i></button>", "<button type=\"button\" name=\"delete\" id=\"9786\" class=\"btn btn-danger btn-xs delete\" ><i class=\"bi bi-trash3\"></i></button>" ], [ "13170", "STI YORKVILLE", "18-19", "TNP / MAM", "COASTVOY", "D.O. / 320000 BBLS", "SAILED / JUL-20-2023 2245", "JUL 2023", "NA", "JUL-20-2023 ", "YES", "N/A", "N/A", "N/A", "N/A", "SCORPIO", "ECOPETROL", "CABOTAGE IN", "FC", "NO", "YES", "YES", "<button type=\"button\" name=\"update\" id=\"9766\" class=\"btn btn-warning btn-xs update\"><i class=\"bi bi-pencil-square\"></i></button>", "<button type=\"button\" name=\"delete\" id=\"9766\" class=\"btn btn-danger btn-xs delete\" ><i class=\"bi bi-trash3\"></i></button>" ], [ "13169", "KALAHARI", "23-24", "SPM 2 / COV", "LDG", "", "SAILED / JUL-24-2023 0900", "JUL 2023", "NA", "JUL-24-2023 ", "YES", "YES", "YES", "N/A", "N/A", "TRAFIGURA", "PHILLIPS 66", "ECOPETROL", "EE", "NO", "YES", "YES", "<button type=\"button\" name=\"update\" id=\"9765\" class=\"btn btn-warning btn-xs update\"><i class=\"bi bi-pencil-square\"></i></button>", "<button type=\"button\" name=\"delete\" id=\"9765\" class=\"btn btn-danger btn-xs delete\" ><i class=\"bi bi-trash3\"></i></button>" ], [ "13168", "HELLAS TATIANA", "", "POZOS / STM", "DISCH", "D.O. / 300000 BBLS", "SAILED / JUL-21-2023 1800", "JUL 2023", "NA", "JUL-19-2023 ", "YES", "N/A", "N/A", "YES", "YES", "NAVIG8 / DA DESK", "TURBO (ASIA) PTE. LTD", "IMPO", "CP", "NO", "YES", "YES", "<button type=\"button\" name=\"update\" id=\"9764\" class=\"btn btn-warning btn-xs update\"><i class=\"bi bi-pencil-square\"></i></button>", "<button type=\"button\" name=\"delete\" id=\"9764\" class=\"btn btn-danger btn-xs delete\" ><i class=\"bi bi-trash3\"></i></button>" ], [ "13166", "CABO SAN ANTONIO", "16-18", "PEND / COV", "LDG", "CAS / 380000 BBLS", "SAILED / JUL-17-2023 0830", "JUL 2023", "NA", "JUL-17-2023 ", "YES", "YES", "YES", "N/A", "N/A", "PANAMAX / FLOPEC", "PHILLIPS 66", "ECOPETROL", "EE", "NO", "YES", "YES", "<button type=\"button\" name=\"update\" id=\"9762\" class=\"btn btn-warning btn-xs update\"><i class=\"bi bi-pencil-square\"></i></button>", "<button type=\"button\" name=\"delete\" id=\"9762\" class=\"btn btn-danger btn-xs delete\" ><i class=\"bi bi-trash3\"></i></button>" ], [ "13165", "DUBAI CHARM", "20-21", "SPM 1 / COV", "LDG", "VAS / 500000 BBLS", "SAILED / JUL-21-2023 0148", "JUL 2023", "NA", "JUL-21-2023 ", "YES", "YES", "YES", "N/A", "N/A", "CONCORD MARITIME / DIABOS", "CITGO", "**UNDEFINED**", "CP", "NO", "YES", "YES", "<button type=\"button\" name=\"update\" id=\"9761\" class=\"btn btn-warning btn-xs update\"><i class=\"bi bi-pencil-square\"></i></button>", "<button type=\"button\" name=\"delete\" id=\"9761\" class=\"btn btn-danger btn-xs delete\" ><i class=\"bi bi-trash3\"></i></button>" ], [ "13164", "NORDIC VEGA", "22-23", "SPM 1 / COV", "LDG", "", "SAILED / JUL-24-2023 0230", "JUL 2023", "NA", "JUL-23-2023 ", "YES", "YES", "YES", "N/A", "N/A", "GAC", "UNIPEC", "ECOPETROL", "FC", "NO", "YES", "YES", "<button type=\"button\" name=\"update\" id=\"9760\" class=\"btn btn-warning btn-xs update\"><i class=\"bi bi-pencil-square\"></i></button>", "<button type=\"button\" name=\"delete\" id=\"9760\" class=\"btn btn-danger btn-xs delete\" ><i class=\"bi bi-trash3\"></i></button>" ], [ "13163", "GLENDA MELANIE", "", "SPRB / BUE", "DISCH", "LUBS", "ETA / AUG-02-2023 1400", "JUL 2023", "TBC", "AUG-03-2023 ", "YES", "N/A", "N/A", "YES", "YES", "GAC", "CHEVRON", "IMPO", "EE", "NO", "NO", "NO", "<button type=\"button\" name=\"update\" id=\"9759\" class=\"btn btn-warning btn-xs update\"><i class=\"bi bi-pencil-square\"></i></button>", "<button type=\"button\" name=\"delete\" id=\"9759\" class=\"btn btn-danger btn-xs delete\" ><i class=\"bi bi-trash3\"></i></button>" ] ]};var table = new DataTable('#test', { data: data.data, scrollX: true});
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. | |