Using same tooltips on columnheaders for different users when columns are shifting per user

Using same tooltips on columnheaders for different users when columns are shifting per user

frankjfrankj Posts: 8Questions: 2Answers: 0

In Laravel I'm using datatables in combination with adminLTE. In tables the first column is a checkbox column to delete items only visible for admin under Laravel permissions (@can <code> @endcan. I want to use tooltips on three columns. In main.js (file of adminLTE) I've put following code which works nice when logged in as an admin.

$('#DataTables_Table_0 thead th:nth-child(4)').each(function () {
        var $td = $(this);
        $td.attr({title:"tooltiptext4"}, $td.text());
     });
     $('#DataTables_Table_0 thead th:nth-child(5)').each(function () {
        var $td = $(this);
        $td.attr({title:"tooltiptext5"}, $td.text());
     });
     $('#DataTables_Table_0 thead th:nth-child(6)').each(function () {
        var $td = $(this);
        $td.attr({title:"tooltiptext6"}, $td.text());
     });

But for regular users - because of hiding the first column to them - the tooltips are placed on the wrong column headers.
I've tried something with variable 'columnnumber', but this hasn't worked out until now. Someone any idea how to solve this? Maybe in some other way as I'm trying to tackle this?

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 21,173Questions: 26Answers: 4,923
    Answer ✓

    Maybe something like this:

    if (admin) {
      var columnnumber = 4;
    } else {
      var columnnumber = 3;
    }
    
    $('#DataTables_Table_0 thead th:nth-child(' + columnnumber + ')').each(function () {
            var $td = $(this);
            $td.attr({title:"tooltiptext4"}, $td.text());
         });
        columnnumber++;
         $('#DataTables_Table_0 thead th:nth-child(' + columnnumber + ')').each(function () {
            var $td = $(this);
            $td.attr({title:"tooltiptext5"}, $td.text());
         });
        columnnumber++;
         $('#DataTables_Table_0 thead th:nth-child(' + columnnumber + ')').each(function () {
            var $td = $(this);
            $td.attr({title:"tooltiptext6"}, $td.text());
         });
    

    Kevin

  • frankjfrankj Posts: 8Questions: 2Answers: 0

    The option with var 'columnnumber' works not with the if(admin) statement, this is not recognized in adminLTE file main.js. When in the Laravel blade view (table header) different classes are assigned for a regular user and for an admin in combination with specific permissions, the problem can be solved with following code in main.js.

    var columnnumber = 0;
    if ($('#DataTables_Table_0').hasClass('user')) {var columnnumber = 5};
    if ($('#DataTables_Table_0').hasClass('admin')) {var columnnumber = 6};
    

    The assigning of var columnnumber on line 1 is needed, because else there will be a problem with not folding out submenu's in adminLTE.

    =====

    An other solution for the problem, I found out, is to add (with Laravel permissions) an empty first column for a regular user, and make it invisible with CSS. Then the tooltips are placed on the same columns for user and admin.

  • kthorngrenkthorngren Posts: 21,173Questions: 26Answers: 4,923

    Glad you got it working.

    works not with the if(admin) statement, this is not recognized in adminLTE file main.js

    I should have been more clear. That part was pseudo code just to highlight assigning the columnnumber the initial value based on the type of user.

    Kevin

This discussion has been closed.