Button Bug
dataTables jquery button bug on column hide
HTML
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css?ver=4.5.1">
<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.css">
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/v/ju/dt-1.10.12/cr-1.3.2/r-2.1.0/sc-1.4.2/datatables.css">
<script src="https://cdn.datatables.net/v/ju/dt-1.10.13/datatables.js"></script>
<table id="files">
<thead>
<tr >
<th>File Name</th>
<th>Length</th>
<th>Action</th>
<th>Options</th>
<th>Classification</th>
<th>Notes</th>
</tr>
</thead>
<tr>
<td >Test2.mov</td>
<td >00:00:40</td>
<td >
<div id="actiongroup1" data-role="controlgroup" data-mini="true">
<input type="radio" name="action_1_d66f40de" value="Opt 1" id="radio_1" CHECKED />
<label for="radio_1">Opt 1</label>
<input type="radio" name="action_1_d66f40de" value="Opt 2" id="radio_2" />
<label for="radio_2">Opt 2</label>
<input type="radio" name="action_1_d66f40de" value="Opt 3" id="radio_3" />
<label for="radio_3">Opt 3</label>
</div>
</td>
<td >
<div id="servicegroup1" class="service_opts" data-role="controlgroup" data-mini="true">
<input type="radio" name="service_1_d66f40de" value="Radio 1" id="radio_4" CHECKED />
<label for="radio_4">Radio 1</label>
<input type="radio" name="service_1_d66f40de" value="Radio 2" id="radio_5" />
<label for="radio_5">Radio 2</label>
<input type="checkbox" name="TC_1_d66f40de" value="Yes" class="tc_button" id="TCcheck1_1_d66f40de" />
<label for="TCcheck1_1_d66f40de">CheckBox</label>
</div>
</td>
<td >
<div >
<select name="style_1_d66f40de" id="style-1">
<option value="" SELECTED>Select..</option>
<option value="S">Type-1</option>
<option value="V">Type-2</option>
<option...
CSS
td, th, label { white-space: nowrap !important }
JavaScript
/*! Responsive 2.2.0-dev
* 2014-2016 SpryMedia Ltd - datatables.net/license
*/
/**
* @summary Responsive
* @description Responsive tables plug-in for DataTables
* @version 2.2.0-dev
* @file dataTables.responsive.js
* @author SpryMedia Ltd (www.sprymedia.co.uk)
* @contact www.sprymedia.co.uk/contact
* @copyright Copyright 2014-2016 SpryMedia Ltd.
*
* This source file is free software, available under the following license:
* MIT license - http://datatables.net/license/mit
*
* This source file is distributed in the hope that it will be useful, but
* WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY
* or FITNESS FOR A PARTICULAR PURPOSE. See the license files for details.
*
* For details please refer to: http://www.datatables.net
*/
(function( factory ){
if ( typeof define === 'function' && define.amd ) {
// AMD
define( ['jquery', 'datatables.net'], function ( $ ) {
return factory( $, window, document );
} );
}
else if ( typeof exports === 'object' ) {
// CommonJS
module.exports = function (root, $) {
if ( ! root ) {
root = window;
}
if ( ! $ || ! $.fn.dataTable ) {
$ = require('datatables.net')(root, $).$;
}
return factory( $, root, root.document );
};
}
else {
// Browser
factory( jQuery, window, document );
}
}(function( $, window, document, undefined ) {
'use strict';
var DataTable = $.fn.dataTable;
/**
* Responsive is a plug-in for the DataTables library that makes use of
* DataTables' ability to change the visibility of columns, changing the
* visibility of columns so the displayed columns fit into the table container.
* The end result is that complex tables will be dynamically adjusted to fit
* into the viewport, be it on a desktop, tablet or mobile browser.
*
* Responsive for DataTables has two modes of operation, which can used
* individually or combined:
*
* * Class name based control - columns assigned class names that...