JSFiddle - React, Tailwind, and code Playground
by 2Yootz
HTML
<link rel="stylesheet" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.0/css/jquery.dataTables.css">
<script src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.0/css/jquery.dataTables_themeroller.css "></script>
<script src="http://cdn.datatables.net/1.10.0/js/jquery.dataTables.js"></script>
<table id="accountOverview" class="table datatable">
<thead>
<tr>
<th>E-Mail</th>
<th>Platform</th>
<th>Coins</th>
<th>Profit / day</th>
<th>Playername</th>
<th>Tradepile Cards</th>
<th>Tradepile Value</th>
<th>Status</th>
</tr>
</thead>
</table>
JavaScript
$(document).ready( function() {
$('#accountOverview').dataTable( {
"columns": [
{ "data": "email" },
{ "data": "platform" },
{ "data": "coins" },
{ "data": "profitDay" },
{ "data": "playerName" },
{ "data": "tradepileCards" },
{ "data": "tradepileValue" },
{ "data": "enabled"}
]
});
$.ajax('/echo/json/',{
type: 'post',
data: { json: JSON.stringify([{
"email":"[email protected]",
"platform":"PS",
"coins":"0",
"profitDay":"0",
"playerName":"Salom\u00f3n Rond\u00f3n",
"tradepileCards":"0",
"tradepileValue":"0",
"enabled":"1"
},{
"email": "[email protected]",
"platform": "PS",
"coins": "0",
"profitDay": "0",
"playerName": "Salomón Rondón",
"tradepileCards": "0",
"tradepileValue": "0",
"enabled": "1"
}
,{
"email": "[email protected]",
"platform": "PS",
"coins": "0",
"profitDay": "0",
"playerName": "Salomón Rondón",
"tradepileCards": "0",
"tradepileValue": "0",
"enabled": "1"
}
,{
"email": "[email protected]",
"platform": "PS",
"coins": "0",
"profitDay": "0",
"playerName": "Salomón Rondón",
"tradepileCards": "0",
"tradepileValue": "0",
"enabled": "1"
}
,{
"email": "[email protected]",
"platform": "PS",
"coins": "0",
"profitDay": "0",
"playerName": "Salomón Rondón",
"tradepileCards": "0",
...