JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdn.datatables.net/v/dt/dt-1.10.12/datatables.min.js"></script>
<table id="outcomtab" style="width:100%" class="rwd-table table-bordered table-hover table-striped">
<thead>
<tr>
<th>Client key</th>
<th>Tel</th>
<th>Commentary</th>
<th>Status</th>
<th>Date</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<span class="ingenius-key">11111111</span>
</td>
<td>052 521 241</td>
<td>
<textarea class="comment"></textarea>
</td>
<td>
<span style="display: none">Refused</span>
<select name="outcom_state">
<option value="1" selected="selected">Non processed</option>
<option value="2">Processed</option>
<option value="3">Refused</option>
<option value="4">Sent</option>
<option value="5">Processing</option>
<option value="6">Signed</option>
</select>
</td>
<td>
<span class="date-modif">25/10/2016 at 12:49:25</span>
</td>
</tr>
<tr>
<td>
<span class="ingenius-key">22222222</span>
</td>
<td>052 521 242</td>
<td>
<textarea class="comment"></textarea>
</td>
<td>
<span style="display: none">Processed</span>
<select name="outcom_state">
<option value="1" selected="selected">Non processed</option>
<option value="2">Processed</option>
<option value="3">Refused</option>
<option value="4">Sent</option>
<option value="5">Processing</option>
<option value="6">Signed</option>
</select>
</td>
<td>
<span class="date-modif">25/10/2016 at 12:02:15</span>
</td>
</tr>
<tr>
<td>
<span class="ingenius-key">33333333</span>
</td>
<td>052 521 243</td>
<td>
<textarea class="comment"></textarea>
</td>
<td>
<span style="display: none">Refused</span>
...
CSS
.rwd-table {
background: ghostwhite;
color: black;
border-spacing: 0;
border: 1px solid black;
overflow: hidden;
font-family: Play, serif;
}
.rwd-table td,
.rwd-table th {
border: 1px solid black;
}
JavaScript
$.fn.dataTableExt.ofnSearch['html-input'] = function(value) {
return $(value).val();
};
$(document).ready(function() {
var table = $('#outcomtab').DataTable({
"order": [],
columnDefs: [
{ "type": "html-input", "targets": [3] }
]
});
});