I tried to set width for column in angular datatables with filters. But width of the column not changed.
I try following
var columnsSpecification = [
{
type: 'text',
bRegex: true,
bSmart: true
}, {
type: 'text',
bRegex: true,
sWidth:"90px"}];
$scope.dtOptions = DTOptionsBuilder.newOptions()
.withBootstrap()
.withOption('scrollX', '700%')
.withOption('scrollY', height + 'px')
.withOption('oLanguage', { "sEmptyTable": " " })
.withOption('lengthMenu', [[-1, 1000, 100, 50, 25, 10], ['All', 1000, 100, 50, 25, 10]])
.withOption('paging', false)
.withOption('bInfo',false)
.withColumnFilter({
aoColumns:columnsSpecification
})
.withTableTools('/Content/DataTables/swf/copy_csv_xls.swf')
.withTableToolsButtons(['xls']);
In html file I tried this:
<table id="table-machines" datatable="ng" class="table table-striped" dt-options="dtOptions">
<thead>
<tr>
<th>Name</th>
<th style="width: 90px !important">Value</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="m in records>
<td>{{m.name}}</td>
<td style="width: 90px !important">{{m.Value}}</td>
</tr>
</tbody>
But Value column another zise rather I setted.
I'v found, that if there is not filter - all fine.
How can I set table width and preserve filters?
As such, the width of the column can be controlled using the columns. width option. This example shows the first column being set to width: 200px (note that this is not pixel perfect in a table, the browser will make some adjustments!), a width that is reflected in the fixed column.
Filtering DataTable varieties of ways include select(String) method, which selects the required row or column and then based on that applies the filter. Filtering can be done using Select, Where, AND, OR, NOT logical operator and on top of it applying the value also there.
Datatables tend to overflow on purpose, as the columns are too wide. You have two options: Remove columns to make it so it fits within the div element. Set overflow-y to scroll or auto in css on the containing div.
vm.dtColumns = [
DTColumnBuilder.newColumn('id').withTitle('ID').withOption('width', '5%')
];
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With