Disable or Hide Buttons if User Does Not Have Access

Disable or Hide Buttons if User Does Not Have Access

RAWaddellRAWaddell Posts: 42Questions: 5Answers: 0
edited March 2018 in Free community support

I've added two buttons to my DT to export to CSV or PDF, but I only want them enabled if the user is an Admin (set as part of the PHP login and stored in $_SESSION['wf_user']['isAdmin']). I saw a similar question (https://datatables.net/forums/discussion/22187/how-to-hide-a-button) but I can't work out how to implement it exactly. My DT definition (as least as far as the buttons go):

    $('#show-entries').DataTable( {
        
        dom: 'Bfrtip',
        buttons: [
            {
                extend: 'csvHtml5', text: 'Export to CSV',
                exportOptions: {
                    columns: [ 1, 2, 5, 6, 3, 4, 14, 15, 8, 16, 
                                17, 18, 9, 19, 10, 11, 20, 12, 21, 22 ]
                }
            },
            {
                extend: 'pdfHtml5', 
                text: 'PDF',
                header: true,
                footer: true,
                title: "WF Online Contest Entries",
                download: 'open',
                orientation: 'landscape',
                pagesize: 'LETTER',
                filename: function(){
                    var d = new Date();
                    var n = d.getTime();
                    return 'WF Online Contest Entries - ' + n;
                },
                extension: '.pdf',
                customize : function(doc) {doc.pageMargins = [10, 10, 10,10 ]; },
                exportOptions: {
                    columns: [ 1, 2, 5, 7, 8, 9, 10, 11, 12 ]
                }
            }
        ],
...

Where/how do I add a function like this to only draw it if isAdmin?

buttons = [ ... ];
 
if ( userHasCreateAccess ) {
  buttons.unshift( { ... create button } );
}

This question has an accepted answers - jump to answer

Answers

  • RAWaddellRAWaddell Posts: 42Questions: 5Answers: 0

    This seems to work (isAdmin is a JS global variable; I'm planning to switch it to a hidden input and reference it by ID instead):

        tblDT = $('#show-entries').DataTable();
    
        console.log ('isAdmin: ' + isAdmin);
    
        if(isAdmin === "1"){
            tblDT.button( 0 ).enable( true );
            tblDT.button( 1 ).enable( true );
            console.log('Button 0 should be ENABLED');
        }else {
            tblDT.button( 0 ).enable( false );
            tblDT.button( 1 ).enable( false );
            console.log('Button 0 should be DISABLED')
        }
    
  • allanallan Posts: 63,695Questions: 1Answers: 10,500 Site admin
    Answer ✓

    Perfect. Thanks for posting back.

    Allan

  • RAWaddellRAWaddell Posts: 42Questions: 5Answers: 0

    You're most welcome, Allan. DataTables has greatly improved both my user interface and my code maintainability, and the help I've received here has been fantastic. I'm very grateful.

  • chazchaz Posts: 1Questions: 0Answers: 0

    In case anyone is looking to hide a button this worked for me.

    In CSS file add: (if you are using bootstrap this class may be defined already)
    
    .hidden {
       display: none !important;
     }
    
    
        var myClass = "";
        if (isAdmin != "1"){
            myClass = 'hidden'
        };
    

    $('#show-entries').DataTable( {
    .....
    extend: 'pdfHtml5',
    text: 'PDF',
    className: myClass, ....

This discussion has been closed.