Basically I am trying to achieve 2 things here. I am using columnFilterWidget.js jQuery DataTable Plugin here for column filtering. I am having some issues in "Excluding" one Extra dropdown which is the 6th <td>
and it has entire dataTable content HTML. Currently Excluding 6th Column is taking off all data and is showing an empty datatable
Here is my HTML:
<table datatable="ng" dt-options="dtOptions"
dt-instance="dtInstanceCallback" style="width: 100%" id="quoteMgmt">
<thead>
<tr>
<th>Customer</th>
<th>Origin City</th>
<th>Origin State</th>
<th>Destination City</th>
<th>Destination State</th>
<th></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="quote in mgmtQuote track by quote.quoteNumber">
<td style="display: none">
{{ quote.customerInfoVo.customerName }}</td>
<td style="display: none">
{{ quote.eqmCommonInfo.origCity }}</td>
<td style="display: none">
{{ quote.eqmCommonInfo.origState }}</td>
<td style="display: none">
{{ quote.eqmCommonInfo.destCity }}</td>
<td style="display: none">
{{ quote.eqmCommonInfo.destState }}</td>
<td>
<div class="row">
<div class="seven columns">
[Datatable Content]
Here is my app.js
$scope.dtOptions = DTOptionsBuilder.newOptions()
.withOption('sDom', 'ltip')
.withOption('iDisplayLength', 25)
.withOption('fnDrawCallback',function(oSettings){$(oSettings.nTHead).hide();SpinnerService.hide();})
.withOption('aaSorting',[])
.withLanguage({"sEmptyTable":"No quotes available"})
.withOption("sDom", 'W<"clear">lfrtip')
.withOption('aoColumnDefs',[{
'bVisible':true,'aTargets':[0,1,2,3,4]
}])
.withOption('aoColumnDefs',[{
'bVisible':false,'aTargets':[5]
}]);
I could fix it by using the syntax differently. On using Angular Datatable DTOptionsBuilder, syntaxes should be used little carefully. Posting my answer in case if it helps someone.