hide export buttons based on condition

hide export buttons based on condition

lenamtllenamtl Posts: 265Questions: 65Answers: 1
edited February 2022 in DataTables 1.10

Hi,

I need to show or hide the export button based on a condition.
I'm wondering what us the best method to achieved this without breaking the Datatables logicial.

Case example

I want to hide all export buttons, but keep the colvis if $showexportbutton = N

$showexportbutton = "<?php echo $buttonvisibility; ?>";

    var table11 = $('#mylist').DataTable({

    "bProcessing": true,

    dom: ' //my settings here ',
        buttons: [
                {
                           extend: 'colvis',
                                // my settings here
                 },
                   {
                    extend: 'excelHtml5',
                                 // my settings here    
                }, .....

Answers

  • colincolin Posts: 15,112Questions: 1Answers: 2,583
    Answer ✓

    Probably the best way would be to just change the buttons object before you initialise the table, something like this: http://live.datatables.net/sumemeha/1/edit

    You could also use jQuery's hide(), but a tech-savvy user could unhide those buttons.

    Colin

  • lenamtllenamtl Posts: 265Questions: 65Answers: 1

    How can I add all the settings to the
    buttons.push( 'excelHtml5');

    for example this code

    {
                extend: 'excelHtml5',
                    text: 'Excel',
                    titleAttr: 'Excel',
                    title: 'Excel',
                    exportOptions: {
                        columns: function (idx, data, th) {
    
                            if ($(th).hasClass('not-export-col')) {
                                return false;
                            }
    
                            if ($(th).hasClass('hidden')) {
                                return false;
                            }
    
                            return table.column(idx).visible();
                        },
                    },
            }, 
    
  • kthorngrenkthorngren Posts: 20,142Questions: 26Answers: 4,736
    Answer ✓

    buttons.push( 'excelHtml5');

    Replace the 'excelHtml5' with the initialization object you posted. You an push a string onto the array or an object :smile:

    Kevin

  • lenamtllenamtl Posts: 265Questions: 65Answers: 1
    edited February 2022

    Hi,

    Here is the updated code but I still have errors
    http://live.datatables.net/seyatuhi/1/edit

    Question1: since which Datatables version I can use buttons.push method?

    Question2: I may have multiple tables ont the same page,
    Set like this
    var table1 = $('#mylist').DataTable....
    var table2 = $('#mysecondlist').DataTable....
    How to push the button per table?

  • kthorngrenkthorngren Posts: 20,142Questions: 26Answers: 4,736
    Answer ✓

    Here is the updated code but I still have errors

    Looks like the example works. What are the errors?

    Question1: since which Datatables version I can use buttons.push method?

    In the example buttons is a Javascript array. It is using Javascript push() to add the buttons to the array. Its not a Datatables specific method.

    Question2: I may have multiple tables ont the same page,
    How to push the button per table?

    If the button configuration is different for each table then use different variables for each table.

    Kevin

  • lenamtllenamtl Posts: 265Questions: 65Answers: 1
    edited February 2022

    JSBIN error on Javascript Column.

    But I thinks this maybe a cache issue as I cannot reproduce the error on JSfiddle.

    Thanks for your help I really appreciate.

    Have a great day

  • kthorngrenkthorngren Posts: 20,142Questions: 26Answers: 4,736
    Answer ✓

    I see. Since you are pushing 3 buttons they need to be in an array like this:
    http://live.datatables.net/seyatuhi/2/edit

    Kevin

  • lenamtllenamtl Posts: 265Questions: 65Answers: 1

    I see thanks

Sign In or Register to comment.