Search code examples
footable

Specify what column triggers data-toggle event


I want to be able to specify what column triggers the data-toggle event so I can have other columns respond to a different event with out toggling the data.

Here's a plunk that will show what I'm seeing: http://plnkr.co/edit/wqyuuqNfb6qxXBWyHoRo

All columns in a row except the first and last will show a modal dialog when clicked. When the screen is shrunk and the data is collapsed, the toggle icon is displayed on the first column. When you click this icon, the data is toggled as expected. The problem I have is when you click the first name, the data is toggled and then the modal is shown. Is there a way to restrict the toggle event to just the column that is specified?


Solution

  • I found an solution. Just add a trigger to collapse the expanded data as below.

    $("table").on("click","td:not(.footable-first-column)",function(e){
        var row=$( this ).parent();
        $(row).trigger('footable_toggle_row');
    
        $(".modal.fade").modal("show");
        return false;
    });
    

    Please find the solution in this plunk: http://plnkr.co/edit/QRQyhvvSOmz5oDlR0Cph?p=preview