skip to Main Content

I need to hide/show action columns based on permissions
if action column is null I want to hide action column, if action has data I want to show that data passes on backend side.

// my backend code php
$data = $this->userModal->userslist();
foreach($data as $d){
if(ChechPermission($this->session->userdata('permissions'), "users", "edit")) {
$d->actions ='
<a href="Users/edit/'.$d->userid.'" class="btn btn-success btn-md"><i class="fas fa-pen-square"></i></a>
';
} else {
$d->actions = '';
}


}
echo json_encode($data); 
// end backend code php
// my datatable

$(document).ready(function(){
 
    $("#userTable").dataTable({
 
        pageLength: 25,
        lengthMenu: [25, 50, 75, 100],
         "dom": '<"top"lfB>rt<"bottom"p><"clear">',
 
        buttons: [
            'copy', 'excel', 'pdf', 'print'
        ],
 
 
 
        'ajax' : {'url' : 'Users/getusers' , dataSrc : ""},
 
        columns : [
 
 
            {data : 'firstname'},
            {data : 'middlename'},
            {data : 'lastname'},
            {data : 'username'},
            {data : 'mobileno'},
            {data : 'statusname'},
            {data : 'groupname'},
            {data : 'actions'}
 
 
        ]
    });
});

my expected code in the datatable is a condition that filters action column data

2

Answers


  1. Hi Abdir Abdirahim Ali,

    There is a visible property which accept boolean.

    https://datatables.net/reference/option/columns.visible

    Here is a example for you.

    Your frontend:

    let showActionColumn= "<?= $showActionColumn ?>";    
    columns : [
            {data : 'firstname'},
            {data : 'middlename'},
            {data : 'lastname'},
            {data : 'username'},
            {data : 'mobileno'},
            {data : 'statusname'},
            {data : 'groupname'},
            {data : 'actions', visible : showActionColumn}
        ]
    

    Your backend:

    $data['showActionColumn'] = ChechPermission($this->session->userdata('permissions'), "users", "edit")
    
    Login or Signup to reply.
  2. Using columnDefs can be useful for your case :

    $('#userTable').DataTable({
            pageLength: 25,
            lengthMenu: [25, 50, 75, 100],
            "dom": '<"top"lfB>rt<"bottom"p><"clear">',
            buttons: [
                'copy', 'excel', 'pdf', 'print'
            ],
            'ajax' : {'url' : 'Users/getusers' , dataSrc : ""},
            columns : [
                {data : 'firstname'},
                {data : 'middlename'},
                {data : 'lastname'},
                {data : 'username'},
                {data : 'mobileno'},
                {data : 'statusname'},
                {data : 'groupname'},
                {data : 'actions'}
            ],
            columnDefs: [
                {
                    targets: 7, // column assigned in the html table
                    "render": function(data, type, row) {
                        let _data = '';
                        if (row['actions'] != '') {     
                            _data = row['actions'] ;
                        }
                        return _data;
                    }
                },
            ]
        });
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search