File
Add library
Share
Login or Register
Help
HTMLSaved
 
<!DOCTYPE html>
<html>
  <head>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
​
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js"></script>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
​
    <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/js/all.min.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" rel="stylesheet" type="text/css" />
​
    <script src="https://cdn.datatables.net/2.1.8/js/dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/2.1.8/js/dataTables.bootstrap5.min.js"></script>
    <link href="https://cdn.datatables.net/2.1.8/css/dataTables.bootstrap5.min.css" rel="stylesheet" type="text/css" />
​
<!--     <script src="https://cdn.datatables.net/2.2.1/js/dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/2.2.1/js/dataTables.bootstrap5.min.js"></script>
    <link href="https://cdn.datatables.net/2.2.1/css/dataTables.bootstrap5.min.css" rel="stylesheet" type="text/css" /> -->
​
    <script src="https://cdn.datatables.net/select/2.1.0/js/dataTables.select.min.js"></script>
    <script src="https://cdn.datatables.net/select/2.1.0/js/select.bootstrap5.min.js"></script>
    <link href="https://cdn.datatables.net/select/2.1.0/css/select.bootstrap5.min.css" rel="stylesheet" type="text/css" />
​
    <script src="https://cdn.datatables.net/plug-ins/2.1.8/features/orderNumbers/dist/dataTables.orderNumbers.min.js"></script>
    <link href="https://cdn.datatables.net/plug-ins/2.1.8/features/orderNumbers/dist/dataTables.orderNumbers.min.css" rel="stylesheet" type="text/css" />
​
    <meta charset=utf-8 />
    <title>DataTables - 2.2.0 Issue</title>
  </head>
  <body>
        <div class="row d-flex align-items-stretch">
        <div class="col-md-8">
​
    <div class="row ms-1 me-0 ">
        <div id="submissionsArea_navCandidate" class="abcs_dt_panel pt-0 abcs_dt_content mt-0" style="border-radius: 8px;">
            <div class="row">
                <div class="col-md-6 offset-md-3 datatable_headerTitle">Submissions</div>
            </div>
            <table id="submissionsTable_navCandidate" class="table table-hover table-bordered table-sm">
              <thead>
              <tr>
                <th></th>
                <th>ID</th>
                <th>Submission<br/>Date</th>
                <th>Submitted By</th>
                <th>Assay</th>
                <th>Candidates</th>
                <th>Accepted</th>
                <th>Declined</th>
                <th>Undecided</th>
                <th>Attachments</th>
                <th>Comments</th>
              </tr>
              </thead>
            </table>
        </div>
    </div>
    <div class="row ms-1 me-0 ">
        <div id="candidateArea_navCandidate" class="abcs_dt_panel pt-0 abcs_dt_content mt-0" style="border-radius: 8px;">
            <div class="row">
                <div class="col-md-6 offset-md-3 datatable_headerTitle">Candidates</div>
            </div>
            <table id="candidateTable_navCandidate" class="table table-hover table-bordered table-sm">
              <thead>
              <tr>
                <th></th>
                <th></th>
                <th>Submission ID</th>
                <th>ID</th>
                <th>Sample</th>
                <th>Fraction</th>
                <th>Subfractions</th>
                <th>Source Plate</th>
                <th>Status ID</th>
                <th>Status</th>
                <th>Reason</th>
                <th>Reason Date</th>
                <th>User</th>
                <th>Comments</th>
                <th>Phylum</th>
                <th>Class</th>
                <th>Order</th>
                <th>Family</th>
                <th>Genus</th>
                <th>Species</th>
              </tr>
              </thead>
            </table>
        </div>
    </div>
         </div>
    </div>
  </body>
</html>
​
CSSSaved
 
body {
  font: 90%/1.45em "Helvetica Neue", HelveticaNeue, Verdana, Arial, Helvetica, sans-serif;
  margin: 0;
  padding: 0;
  color: #333;
  background-color: #fff;
}
​
/* HEADER & FOOTER: Font */
table.table > thead > tr > th,
table.table > tfoot > tr > th {
    font-size: 12px;
    line-height: 1.2em;
}
​
/* HEADER & FOOTER: Background */
table.table.dataTable > thead > tr > th,
table.table.dataTable > tfoot > tr > th {
    background-color: #efefef;
}
​
table.dataTable td.dt-empty {
  font-size: 12px;
}
​
/* Configuration table information summary */
div.dt-container div.dt-info {
    padding-top: 0px;
    padding-left: 4px;
    color: rgba(154, 64, 81, 0.85); /*#1D5E86;*/
    /*background-color: rgba(236, 236, 236, 0.33);*/
    font-size: 12px;
    font-weight: bold;
    border-style: solid;
    border-color: rgb(222, 226, 230);
    border-width: 0px 0px 0px 0px;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}
​
/* Configuration table information summary */
div.dataTables_wrapper div.dataTables_info {
    padding-top: 0.25em;
    padding-left: 4px;
    color: rgba(154, 64, 81, 0.85); /*#1D5E86;*/
    background-color: rgba(236, 236, 236, 0.33);
    font-size: 12px;
    font-weight: bold;
    border-style: solid;
    border-color: rgb(222, 226, 230);
    border-width: 1px 0px 0px 0px;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}
​
/* SELECTED RECORD: When selected */
table.table.dataTable > tbody > tr.selected > *,
table.table.dataTable.table_hover > tbody > tr.selected > *,
table.table.dataTable.table-striped > tbody > tr.odd.selected > * {
    box-shadow: inset 0 0 0 9999px #9bc8fd;
    color: black;
}
​
/* SELECTED RECORD: When hovering over it */
table.table.dataTable > tbody > tr.selected:hover > *,
table.table.dataTable.table_hover > tbody > tr.selected:hover > *,
table.table.dataTable.table-striped > tbody > tr.odd.selected:hover > * {
    box-shadow: inset 0 0 0 9999px #9bc8fdaa !important;
    color: black;
}
​
.abcs_dt_panel {
    position: relative;
    width: 100%;
    padding: 2px 2px;
    display: inline-block;
    background: #fff;
    /*border: 1px solid #E6E9ED;*/
    -webkit-column-break-inside: avoid;
    -moz-column-break-inside: avoid;
    column-break-inside: avoid;
    opacity: 1;
    transition: all .2s ease
}
​
.abcs_dt_content {
    padding: 0 5px 6px;
    position: relative;
    width: 100%;
    float: left;
    clear: both;
    margin-top: 5px
}
​
/* Label & Bootstrap-select (selectPicker) within datatable content */
.abcs_dt_content  label.input-group-text {
    background-color: #1d5e88;
    border: 1px solid #0f798a;
    color: #fff;
    font-size: 11px;
    padding: 1px 12px;
    border-top-left-radius: 0.30rem;
    border-top-right-radius:0rem;
    border-bottom-right-radius: 0rem;
    border-bottom-left-radius: 0.30rem;
}
​
.datatable_headerTitle {
    text-align: center;
    color: rgba(154, 64, 81, 0.85);
    font-weight: bold;
}
​
table.table.dataTable > tbody > tr > td.cpc_acceptedStatus,
table.table.dataTable > tbody > tr:hover > td.cpc_acceptedStatus
{
    color: #019201;
}
​
table.table.dataTable > tbody > tr > td.cpc_declinedStatus,
table.table.dataTable > tbody > tr:hover > td.cpc_declinedStatus {
    color: #c53c5b;
}
​
table.table.dataTable > tbody > tr > td.cpc_unreviewedStatus,
table.table.dataTable > tbody > tr:hover > td.cpc_unreviewedStatus {
    color: #0062cc;
}
​
/* Override dt_type_date alignment for all date columns */
.dt-type-date {
    text-align: center !important;
}
​
/* Allow override dt_type_numeric alignment if user specified */
table.dataTable thead th.dt-center.dt-type-numeric,
table.dataTable tr td.dt-center.dt-type-numeric,
table.dataTable tfoot th.dt-center.dt-type-numeric {
    text-align: center !important;
}
  
.dt-indexCol {
    background-color: #efefef !important;
    padding-top: 6px !important;
    text-align: center;
    font-size: .85em;
}
​
/* -------------------------------------------------- */
/* Sorting icons and positioning overrides */
​
/* Previously displayed two separate icons, hide first one */
table.dataTable thead .dt-column-order {
    top: 0.18em !important;
    right: 0.2em !important;
    font-family: 'Font Awesome 6 Free' !important;
    font-size: 1.3em !important;
}
​
table.dataTable thead .dt-column-order:before,
table.dataTable thead .dt-column-order:after
{
    content: "" !important;
}
​
/* Only display in after */
table.dataTable thead > tr > th.dt-orderable-asc .dt-column-order:after
{
    /*right:    0 !important;*/
    content: "\f0dc" !important;
    color: blue !important;
    opacity: 0.3 !important;
    top: unset !important;
    bottom: 0.3em !important;
    line-height: unset !important;
    padding-left: 5px;
}
​
table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order:after,
table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order:after {
    content: "\f161" !important;
    color: blue !important;
    opacity: 0.7 !important;
    top: unset !important;
    bottom: 0.3em !important;
    line-height: unset !important; /* DataTable 1.12 set to 9px */
    padding-left: inherit;
}
​
table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order:after,
table.dataTable thead > tr > td.dt-ordering-desc span.dt-column-order:after {
    content: "\f160" !important;
    color: blue !important;
    opacity: 0.7 !important;
    top: unset !important;
    bottom: 0.3em !important;
    line-height: unset !important; /* DataTable 1.12 set to 9px */
    padding-left: inherit;
}
​
/* Override the DataTables orderNumbers plugin css style to display to the left of the sort icon */
table.dataTable thead span.dt-order-number {
    top: unset;
    right: 15px;
    width: 1.3em;
    height: 1.3em;
    font-size: 10px;
    line-height: 13px;
}
​
/* Add DataTables orderNumbers plugin css style to display above the sort icon */
table.dataTable thead span.dt-order-number-top {
    position: absolute;
    top: 2px;
    right: 2px;
    color: var(--dt-order-numbers-light-color, white);
    background: var(--dt-order-numbers-light-background, #555);
    border-radius: 10px;
    width: 1.5em;
    text-align: center;
    height: 1.5em;
    font-size: 11px;
    line-height: 15px;
}
​
/* Override the DataTables orderNumbers plugin variables */
table {
    --dt-order-numbers-light-color: white;
    --dt-order-numbers-light-background: #1d5e88;
    --dt-order-numbers-dark-color: black;
    --dt-order-numbers-dark-background: #d3d3d3;
}
JavaScriptSaved
 
var submissionData = [
  {
    "ID": "1",
    "ASSAY_NAME": "PKADJ",
    "FULL_NAME": "Chris Wolcott",
    "SUBMIT_DATE": "2024-05-01 13:16",
    "NPCS_COMMENTS": null,
    "NPCS_ATTACHMENTS": "0",
    "CANDIDATES": "15",
    "ACCEPTED": "1",
    "DECLINED": "1",
    "UNDECIDED": "13"
},
{
    "ID": "2",
    "ASSAY_NAME": "MPM",
    "FULL_NAME": "Brice Wilson",
    "SUBMIT_DATE": "2024-06-05 09:25",
    "NPCS_COMMENTS": null,
    "NPCS_ATTACHMENTS": "0",
    "CANDIDATES": "9",
    "ACCEPTED": "0",
    "DECLINED": "0",
    "UNDECIDED": "9"
}
  ];
​
var candidateData = [];
candidateData[1] =[
  {
    "ID": "16",
    "SUBM_ID": "2",
    "SAMPLE": "C000509",
    "FRACTION": "3",
    "SUBFRACTIONS": "18, 19, 20, 21",
    "PLATE_NAME": "MPM_240425_M_09",
    "STATUS_ID": "-1",
    "STATUS": "Undecided",
    "REASON": null,
    "REASON_DATE": null,
    "REASON_COMMENTS": null,
    "STATUS_USER": null,
    "PHYLUM_NM": "Porifera",
    "CLASS_NM": "Demospongiae",
    "ORDER_NM": "Choristida",
    "FAMILY_NM": "Pachastrellidae",
    "GENUS_NM": "Pachastrella",
    "SPECIES_NM": "sp. a"
  },{
    "ID": "17",
    "SUBM_ID": "2",
    "SAMPLE": "C000809",
    "FRACTION": "6",
    "SUBFRACTIONS": "15, 17",
    "PLATE_NAME": "MPM_240425_M_03",
    "STATUS_ID": "-1",
    "STATUS": "Undecided",
    "REASON": null,
    "REASON_DATE": null,
    "REASON_COMMENTS": null,
    "STATUS_USER": null,
    "PHYLUM_NM": "Porifera",
    "CLASS_NM": "Demospongiae",
    "ORDER_NM": "Petrosida",
    "FAMILY_NM": "Petrosiidae",
    "GENUS_NM": "Petrosia",
    "SPECIES_NM": "sp.a"
  }];
​
candidateData[2] =[
{
    "ID": "1",
    "SUBM_ID": "1",
    "SAMPLE": "C001599",
    "FRACTION": "5",
    "SUBFRACTIONS": "7, 8, 9, 10, 11",
    "PLATE_NAME": "MPM_240315_M_01",
    "STATUS_ID": "1",
    "STATUS": "Accepted",
    "REASON": null,
    "REASON_DATE": null,
    "REASON_COMMENTS": null,
    "STATUS_USER": null,
    "PHYLUM_NM": "Echinodermata",
    "CLASS_NM": "Holothuroidea",
    "ORDER_NM": "Aspidochirotida",
    "FAMILY_NM": "Holothuriidae",
    "GENUS_NM": "Actinopyga",
    "SPECIES_NM": "miliaris"
  },{
    "ID": "2",
    "SUBM_ID": "1",
    "SAMPLE": "C001741",
    "FRACTION": "6",
    "SUBFRACTIONS": "11, 12, 13, 14, 15",
    "PLATE_NAME": "MPM_240315_M_01",
    "STATUS_ID": "0",
    "STATUS": "Declined",
    "REASON": "Taxonomy Dereplication",
    "REASON_DATE": "2025-01-06 16:27",
    "REASON_COMMENTS": "dsda",
    "STATUS_USER": "Wolcott",
    "PHYLUM_NM": "Chordata",
    "CLASS_NM": "Ascidiacea",
    "ORDER_NM": "Aplousobranchia",
    "FAMILY_NM": "Didemnidae",
    "GENUS_NM": "Lissoclinum",
    "SPECIES_NM": "sp. 3"
  },{
    "ID": "3",
    "SUBM_ID": "1",
    "SAMPLE": "C002189",
    "FRACTION": "4",
    "SUBFRACTIONS": "13, 14",
    "PLATE_NAME": "MPM_240315_M_02",
    "STATUS_ID": "-1",
    "STATUS": "Undecided",
    "REASON": null,
    "REASON_DATE": null,
    "REASON_COMMENTS": null,
    "STATUS_USER": null,
    "PHYLUM_NM": "Chordata",
    "CLASS_NM": "Ascidiacea",
    "ORDER_NM": "Aplousobranchia",
    "FAMILY_NM": "Polyclinidae",
    "GENUS_NM": "Pseudodistoma",
    "SPECIES_NM": "sp. 5 orange morph"
  },{
    "ID": "4",
    "SUBM_ID": "1",
    "SAMPLE": "C002213",
    "FRACTION": "4",
    "SUBFRACTIONS": "5",
    "PLATE_NAME": "MPM_240315_M_02",
    "STATUS_ID": "-1",
    "STATUS": "Undecided",
    "REASON": null,
    "REASON_DATE": null,
    "REASON_COMMENTS": null,
    "STATUS_USER": null,
    "PHYLUM_NM": null,
    "CLASS_NM": null,
    "ORDER_NM": null,
    "FAMILY_NM": "Haliclonidae",
    "GENUS_NM": "Adocia",
    "SPECIES_NM": "sp. l"
  }];
​
    let submissionTableOptions = {
        layout: {
            topStart: null, topEnd: null,
            bottomStart: 'info', bottomEnd: null
        },
        scrollX:        true,
        scrollY:        "45vh",
        scrollCollapse: true,
        pageLength: -1,
        select: {style: 'single'},
        keys: {keys: [38, 40]},
        order: [[2, "desc"]],
        rowId: 'ID',
        language: {
            emptyTable: "<span style='color: firebrick;'>No submissions based on filters</span>",
            zeroRecords: "<span style='color: firebrick;'>No submissions based on filters</span>",
            info           : 'SUBMISSIONS: _END_ records',
            infoEmpty      : "Submission: No submissions to show based on filters",
            infoFiltered   : ' (filtered from _MAX_ total)',
            select: {
                rows: {
                    0: "",
                    1: "[1 row selected]"
                }
            }
        },
        orderNumbers: {className: 'dt-order-number-top'},
        columnDefs: [
            {orderSequence: ['desc', 'asc'], targets: '_all'},
            {
                target: 0,
                defaultContent: '',
                searchable: false,
                orderable: false,
                className: 'dt-indexCol',
                width: 25,
            },
            {
                target: 1,
                data:   function (d) {return +d.ID;},
                visible: false,
                width:  20
            },
            {
                target: 2,
                data:   function (d) {return d.SUBMIT_DATE;},
                width:  105
            },
            {   target: 3,
                name: 'USER',
                data: function (d) {return d.FULL_NAME;},
                width: 130
            },
            {   target: 4,
                data: function (d) {return d.ASSAY_NAME;},
                className: 'dt-center',
                width: 60
            },
            {
                target: 5,
                data: function (d) {return d.CANDIDATES;},
                className: 'dt-center',
                width:40
            },
            {
                target: 6,
                name: 'ACCEPTED',
                data: function (d) {return d.ACCEPTED;},
                render: function (data, type, row) {
                    return (data === 0) ? null : data;
                },
                className: 'dt-center',
                width: 40
            },
            {
                target: 7,
                name: 'DECLINED',
                data: function (d) {return d.DECLINED;},
                render: function (data, type, row) {
                    return (data === 0) ? null : data;
                },
                className: 'dt-center',
                width: 40
            },
            {
                target: 8,
                name: 'UNDECIDED',
                data: function (d) {return d.UNDECIDED;},
                render: function (data, type, row) {
                    return (data === 0) ? null : data;
                },
                className: 'dt-center',
                width: 40
            },
            {
                target: 9,
                data: function (d) {return d.NPCS_ATTACHMENTS;},
                render: function (data, type, row) {
                    return (data === 1) ? "Yes" : "No";
                },
                className: 'dt-center',
                width: 60
            },
            {
                target: 10,
                data: function (d) {return d.NPCS_COMMENTS;},
            },
        ],
        createdRow: function(row, data, dataIndex) {
            let acceptedColVisIdx = submissionsTable.column("ACCEPTED:name").index('visible');
            let acceptedTD = 'td:eq(' + acceptedColVisIdx + ')';
​
            let declinedColVisIdx = submissionsTable.column("DECLINED:name").index('visible');
            let declinedTD = 'td:eq(' + declinedColVisIdx + ')';
​
            let undecidedColVisIdx = submissionsTable.column("UNDECIDED:name").index('visible');
            let undecidedTD = 'td:eq(' + undecidedColVisIdx + ')';
​
            $(row).find(undecidedTD).addClass('cpc_unreviewedStatus');
            $(row).find(acceptedTD).addClass('cpc_acceptedStatus');
            $(row).find(declinedTD).addClass('cpc_declinedStatus');
        }
    };
          
    let submissionsTable = $('#submissionsTable_navCandidate').DataTable(submissionTableOptions);
          
    submissionsTable.on('order.dt search.dt', function () {
        let i = 1;
​
        submissionsTable
            .cells(null, 0, { search: 'applied', order: 'applied' })
            .every(function (cell) {
                this.data(i++);
            });
    }).draw();   
​
    submissionsTable.clear().rows.add(submissionData).draw();
​
    // SELECT record in submissions table
    submissionsTable.on('select.dt', function ( e, dt, type, indexes ) {
​
        // Determine the selected row submission id and retrieve candidates
        let id = submissionsTable.row({selected: true}).id();
        $('#candidateTable_navCandidate').DataTable().clear().rows.add(candidateData[id]).draw();
    });
​
    // Special case to clear details.  Only when the user clicks on the same row that is currently selected
    $('#submissionsTable_navCandidate tbody').on( 'click', 'tr', function ( e, dt, type, indexes) {
        oldIdx = submissionsTable.row({selected: true}).index();
        newIdx = submissionsTable.row(this).index();
        if (oldIdx === newIdx) {
            $('#candidateTable_navCandidate').DataTable().clear().draw();
        }
    });
// ----------------
   let candidateTableOptions = {
        layout: {
            topStart: null, topEnd: null,
            bottomStart: 'info', bottomEnd: null
        },
        scrollX:        true,
        scrollY:        "260px",
        scrollCollapse: true,
        select: {
            style: 'os',
            //selector: 'td:nth-child(2)' // Only allow selecting in the nth column rather than any column
        },
        order: [[4, "asc"]],
        pageLength: -1,
        rowId: 'SAMPLE',
        language: {
            loadingRecords : '&nbsp;',
            emptyTable     : '<span style="color: firebrick;"><i class="fa-regular fa-hand-point-up fa-lg fa-fade" style="--fa-animation-duration: 2s;"></i> Select a <b>submission</b> to see candidates</span> ',
            info           : 'CANDIDATES: _END_ records',
            infoEmpty      : "CANDIDATES: No candidates to show",
            infoFiltered   : ' (filtered from _MAX_ total)',
            select: {
                rows: {
                    0: "",
                    1: "[1 row selected]"
                }
            }
        },
        orderNumbers: true, // {className: 'dt-order-number-top'},
        columnDefs: [
            {orderSequence: ['desc', 'asc'], targets: '_all'},
            {
                target: 0,
                defaultContent: '',
                searchable: false,
                orderable: false,
                className: 'dt-indexCol',
                width: 25,
            },
            {
                targets: 1,
                render: DataTable.render.select(),
                orderable: false,
                width: 25,
            },
            {
                target: 2,
                data:   function (d) {return +d.SUBM_ID;},
                visible: false,
            },
            {
                target: 3,
                data:   function (d) {return +d.ID;},
                visible: false,
            },
            {
                target: 4,
                data: function (d) {return d.SAMPLE;},
                width: 40,
            },
            {
                target: 5,
                data: function (d) {return d.FRACTION;},
                className: 'dt-center',
                width: 55,
            },
            {
                target: 6,
                data: function (d) {return d.SUBFRACTIONS;},
                className: 'dt-left',
                width: 140,
            },
            {
                target: 7,
                data: function (d) {return d.PLATE_NAME;},
                visible: false,
            },
            {
                target: 8,
                data: function (d) {return d.STATUS_ID;},
                visible: false,
            },
            {
                target: 9,
                name: 'STATUS',
                data: function (d) {return d.STATUS;},
                className: 'dt-center',
                width: 60,
            },
            {
                target: 10,
                data: function (d) {return d.REASON;},
                className: 'dt-nowrap',
                width: 120,
            },
            {
                target: 11,
                data: function (d) {return d.REASON_DATE;},
                width: 105,
            },
            {
                target: 12,
                data: function (d) {return d.STATUS_USER;},
                width: 50,
            },
            {
                target: 13,
                data: function (d) {return d.REASON_COMMENTS;},
            },
            {
                target: 14,
                name: 'PHYLUM_NM',
                data: function (d) {return d.PHYLUM_NM;},
            },
            {
                target: 15,
                name: 'CLASS_NM',
                data: function (d) {return d.CLASS_NM;},
            },
            {
                target: 16,
                name: 'ORDER_NM',
                data: function (d) {return d.ORDER_NM;},
            },
            {
                target: 17,
                name: 'FAMILY_NM',
                data: function (d) {return d.FAMILY_NM;},
            },
            {
                target: 18,
                name: 'GENUS_NM',
                data: function (d) {return d.GENUS_NM;},
            },
            {
                target: 19,
                name: 'SPECIES_NM',
                data: function (d) {return d.SPECIES_NM;},
            },
        ],
        createdRow: function(row, data, dataIndex) {
            let statusColVisIdx = candidateTable.column("STATUS:name").index('visible');
            let statusTD = 'td:eq(' + statusColVisIdx + ')';
​
            if (data.STATUS_ID == -1) $(row).find(statusTD).addClass('cpc_unreviewedStatus');
            if (data.STATUS_ID ==  1) $(row).find(statusTD).addClass('cpc_acceptedStatus');
            if (data.STATUS_ID ==  0) $(row).find(statusTD).addClass('cpc_declinedStatus');
        }
    };
    let candidateTable = $('#candidateTable_navCandidate').DataTable(candidateTableOptions);
​
15 warnings
Line 149: 'let' is available in ES6 (use esnext option) or Mozilla JS extensions (use moz).
Line 258: 'let' is available in ES6 (use esnext option) or Mozilla JS extensions (use moz).
Line 259: 'let' is available in ES6 (use esnext option) or Mozilla JS extensions (use moz).
Line 261: 'let' is available in ES6 (use esnext option) or Mozilla JS extensions (use moz).
Line 262: 'let' is available in ES6 (use esnext option) or Mozilla JS extensions (use moz).
Line 264: 'let' is available in ES6 (use esnext option) or Mozilla JS extensions (use moz).
Line 265: 'let' is available in ES6 (use esnext option) or Mozilla JS extensions (use moz).
Line 273: 'let' is available in ES6 (use esnext option) or Mozilla JS extensions (use moz).
Line 276: 'let' is available in ES6 (use esnext option) or Mozilla JS extensions (use moz).
Line 291: 'let' is available in ES6 (use esnext option) or Mozilla JS extensions (use moz).
Line 304: 'let' is available in ES6 (use esnext option) or Mozilla JS extensions (use moz).
Line 445: 'let' is available in ES6 (use esnext option) or Mozilla JS extensions (use moz).
Line 446: 'let' is available in ES6 (use esnext option) or Mozilla JS extensions (use moz).
Line 450: Use '===' to compare with '0'.
Line 453: 'let' is available in ES6 (use esnext option) or Mozilla JS extensions (use moz).
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers