Bootstrap-table HideRow+FixedColumns
Bootstrap table - show/hideRows bug with fixed-columns extension, see https://github.com/wenzhixin/bootstrap-table/issues/1952
HTML
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://rawgit.com/wenzhixin/bootstrap-table/master/src/bootstrap-table.css">
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.10.0/bootstrap-table.min.js"></script>
<h4>Bootstrap-table</h4>
<ol>
<li>Use checkboxes to show/hide rows</li>
</ol>
<table id="table" data-toggle="table" data-unique-id="institution" data-fixed-columns="true" data-show-columns="true">
<thead>
<tr>
<th data-field="uniqueId" data-visible="true"></th>
<th data-field="name" data-sortable="false">Name</th>
<th data-field="institution" data-sortable="false">City</th>
</tr>
</thead>
<tbody>
<tr>
<td>fda</td>
<td>Alex</td>
<td>Anaheim</td>
</tr>
<tr>
<td>13</td>
<td>Ben</td>
<td>Boston</td>
</tr>
<tr>
<td>vvv</td>
<td>Cathy</td>
<td>Chicago</td>
</tr>
<tr>
<td>#^</td>
<td>Darren</td>
<td>Denver</td>
</tr>
</tbody>
</table>
<div class="checkbox">
<label>Anaheim
<input type="checkbox" data-bs-table-unique-id="Anaheim" checked>
</label>
</div>
<div class="checkbox">
<label>Ben
<input type="checkbox" data-bs-table-unique-id="13" checked>
</label>
</div>
<div class="checkbox">
<label>Cathy
<input type="checkbox" data-bs-table-unique-id="vvv" checked>
</label>
</div>
<div class="checkbox">
<label>Darren
<input type="checkbox" data-bs-table-unique-id="#^" checked>
</label>
</div>
JavaScript
// Bootstrap table - Bootstrap table - show/hideRows bug with fixed-columns extension, see https://github.com/wenzhixin/bootstrap-table/issues/1952
$(function () {
$('input[type=checkbox][data-bs-table-unique-id]').change(function() {
if ($(this).prop("checked")) {
$('#table').bootstrapTable('showRow', {
'uniqueId': $(this).data('bs-table-unique-id')
});
} else
$('#table').bootstrapTable('hideRow', {
'uniqueId': $(this).data('bs-table-unique-id')
});
});
});