var datatable;
var todos;

$(document).ready(function(){
     datatable = $('#bookings').DataTable({
        paging: false,
        searching:true,
        scrollX:false,
        info:false, 
        order: [[ 1, 'desc' ]],
        ajax: { url: '/Ajax/getOverviewData', dataSrc:''},
        dom: '<"toolbar">frt',
        columns: columns,
    });
    $("div.toolbar").html('<a class="btn-sm btn-secondary" href="/Home/newBill" role="button">Neuer Eintrag</a>');
    // Add event listener for opening and closing details
    $('#bookings tbody').on('click', 'td.dt-receiver', function () {collapseDetails($(this), datatable);} );
    $('#bookings tbody').on('click', 'td.dt-datum', function () {location.href = '/Home/editBill/'+getId($(this),todos);});
    $('#bookings tbody').on('click', 'table.tabdet', function () {location.href = '/Home/editBill/'+$(this).attr('data-bs-id');});

    todos = $('#todos').DataTable({
        paging: true,
        searching:true,
        scrollX:false,
        info:true, 
        order: [[ 1, 'desc' ]],
        ajax: { url: '/Ajax/getToDosData', dataSrc:''},
        dom: '<"top"i<"syncbutton">>frt<"bottom"lp><"clear">',
        columns: columns,
    });
    $("div.syncbutton").html('<a class="btn-sm btn-secondary" href="/Home/syncScheduled" role="button">Sync</a>');
    // Add event listener for opening and closing details
    $('#todos tbody').on('click', 'td.dt-receiver', function () {collapseDetails($(this), todos);} );
    $('#todos tbody').on('click', 'td.dt-datum', function () {location.href = '/Home/editBill/'+getId($(this),todos);});
    $('#todos tbody').on('click', 'table.tabdet', function () {location.href = '/Home/editBill/'+$(this).attr('data-bs-id');});
});