JSFiddle - React, Tailwind, and code Playground

by André Albson

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.8.1/bootstrap-table.css">
<script src="https://rawgit.com/wenzhixin/bootstrap-table/master/dist/bootstrap-table.js"></script>
<script src="https://rawgit.com/wenzhixin/bootstrap-table/master/dist/extensions/filter-control/bootstrap-table-filter-control.js"></script>
<table ref="mainTable" class="table table-striped table-bordered table-hover" 
                cellSpacing="0" id="mainTable" data-show-toggle="true" 
                data-show-columns="true" data-search="true" data-pagination="true" data-filter-control="true">
             <thead>
                <tr>
                   <th data-field="state" data-checkbox="true"></th>
                   <th data-field="Customer Name" data-sortable="true" data-filter-control="select">Customer Name</th>
                   <th data-field="Location Type" data-sortable="true">Location Type</th>
                   <th data-field="Location" data-sortable="true" data-filter-control="select">Location</th>
                </tr>
             </thead>
             <tbody>
                <tr>
                   <td></td>
                   <td>Cap Corp</td>
                   <td>Main</td>
                   <td>Norwalk CT 06851</td>
                </tr>
                <tr>
                   <td></td>
                   <td>Cap Corp</td>
                   <td>Other</td>
                   <td>Norwalk CT 06851</td>
                </tr>
                <tr>
                   <td></td>
                   <td>Tel</td>
                   <td>Main</td>
                   <td>Slough SL1 4DX</td>
                </tr>
                <tr>
                   <td></td>
                   <td>Tel</td>
                   <td>Other</td>
                   <td>London W1B 5HQ</td>
                </tr>
             </tbody>
          </table>

JavaScript

$('#mainTable').bootstrapTable({
});