DataTable not rendering properly on small devices
DataTable not rendering properly on small devices
![Deleu](https://secure.gravatar.com/avatar/3454f71ef0db43b54bf91b0770523438/?default=https%3A%2F%2Fvanillicon.com%2F3454f71ef0db43b54bf91b0770523438_200.png&rating=g&size=120)
I took a screenshot from studiopress.com/responsive of my layout to try and explain the problem:
http://puu.sh/gVfzU/b7b7af67e7.png
When on a small device, the data insertion is not rendering the first column.
Here is my code:
JS:
elem.DataTable({'language': Nav.plugin.datatable.language});
var base = elem.find('tbody tr:first');
var elements = base.find('[data-name]');
var names = elements.map(function () {
return jQuery(this).attr('data-name');
}).get();
elem.dataTable().fnDeleteRow(0);
elem.load = function (data) {
if (!data)
data = [];
var rows = elem.find('tbody tr');
rows.remove();
for (var i = 0; i < data.length; i++) {
var append = [];
for (var j = 0; j < names.length; j++) {
append[j] = data[i][names[j]];
}
elem.DataTable().row.add(append).draw();
}
};
HTML:
<table class="table table-striped table-bordered bootstrap-datatable datatable responsive"
data-plugin="nav-datatable" data-service="user/account" data-method="accountList">
<thead>
<tr>
<th>@{page.user.account.name}</th>
<th>@{page.user.account.email}</th>
</tr>
</thead>
<tbody>
<tr>
<td data-name="name"></td>
<td class="center" data-name="email"></td>
</tbody>
</table>
This discussion has been closed.