JSFiddle - React, Tailwind, and code Playground

by Daniel Brose

HTML

<link rel="stylesheet" href="https://rawgit.com/wenzhixin/bootstrap-table/master/src/bootstrap-table.css">
<script src="https://rawgit.com/wenzhixin/bootstrap-table/master/src/bootstrap-table.js"></script>

            <select id="findfaction" class="form-control"><option></option></select>
            <button id="clearsearch" class="btn btn-info"><span class="glyphicon glyphicon-eye-open"></span> Clear Search </button>
<select id="findclass" class="form-control gosearch"><option></option></select>
                    <select id="finddisc" class="form-control gosearch"><option></option></select>
                    <select id="findlvl" class="form-control gosearch"><option></option></select>
<table id="main">
</table>

JavaScript

$(document).ready(function(){
//initialize main table
$('#main').bootstrapTable({
	url: 'http://tinkeringtester.com//swtor/Includes/getdps.php?d='+$.now(),
	pagination: true,
	sidePagination: 'server',
	pageSize: '12',
	pageList: '[12, 24, All]',
	//showPaginationSwitch: true,
	//showColumns: true,
	//showRefresh: true,
	// toolbar: '#toolbar',
	detailView: true,
	uniqueId: 'ID',
	clickToSelect: true,
	selectItemName: 'chkID',
	columns:[
		{
			radio: true,
			field: 'chkID'
		},
		{ field: 'class' },
		{ field:'disc' },
		{ field: 'lvl' },
		{ field: 'dps' },
		{ field: 'apm'},
		{ field: 'master'},
		{ field: 'power' },
		{ field: 'crit'},
		{ field: 'alac'},
		{ field: 'acc'},
		{ field: 'id', visible: false, }
	],
	queryParams: function(params){
		params.faction=$('#findfaction').text();
		params.class=$('#findclass').text();
		params.disc=$('#finddisc').text();
		params.lvl=$('#findlvl').text();
		var iRows = params.limit;
		
		return params;
	},
	onExpandRow: function (index, row, $detail) {
		//compExtInfo($detail, row);
	}
});
});