Home Angularjs Datatable ColumnFixed plugin
Reply: 0

Angularjs Datatable ColumnFixed plugin

J. B
1#
J. B Published in 2018-02-13 17:28:55Z

I am struggling with one of the angular-datatable plugins named columnFixed. The whole grid was working charming and nice but I need to introduce 3 columns fixed and that affect the render process of 3 inner directives that I render in my first 4 columns. Does anyone have any idea about this type of issues?

HTML

<article>
<table 
       datatable="" 
       dt-options="$ctrl.dtOptions" 
       dt-column-defs="$ctrl.dtColumnDefs" 
       dt-columns="$ctrl.dtColumns"  
       dt-instance="$ctrl.dtInstance" >
</table>

</article>

AngularJS

 $ctrl.dtOptions = DTOptionsBuilder
        .newOptions()
        .withFnServerData(serverData)
        .withDataProp('data')
        .withOption('responsive', $ctrl.options.isResponsive)
        .withOption('filter', $ctrl.options.dtFilter)
        .withOption('serverSide', true)
        .withOption('dom', '<"top"l>rt<"bottom"ip><"clear">')
        .withOption('aaSorting', [[$ctrl.options.sortBy.columnIndex, 
                                   $ctrl.options.sortBy.order]])
        .withOption('createdRow', onCreatedRow)
        .withOption('headerCallback',headerCallback)
        .withPaginationType($ctrl.options.dtPaginationTypeName)
        .withOption('lengthMenu',  [5,10,15,[5,10,15])   
        .withOption('scrollY', '300px')
        .withOption('scrollX', '100%')
        .withOption('scrollCollapse', true)                             
        .withOption('fixedColumns',{
                     leftColumns: 3 
        });


        $ctrl.dtColumnDefs = [
            DTColumnDefBuilder.newColumnDef(0).renderWith(checkForSelection),           
            DTColumnDefBuilder.newColumnDef(1).renderWith(directive1),
            DTColumnDefBuilder.newColumnDef(2).renderWith(directive2),
            DTColumnDefBuilder.newColumnDef(3).renderWith(directive3),
            DTColumnDefBuilder.newColumnDef(4).renderWith(getOwner),
            DTColumnDefBuilder.newColumnDef(5)                   
        ];                  
        //Load this from a promise    
        $ctrl.dtColumns = dtOptionService.getColumnsByGridName($ctrl.gridName).$promise;   
        $ctrl.dtInstance = {};        
You need to login account before you can post.

About| Privacy statement| Terms of Service| Advertising| Contact us| Help| Sitemap|
Processed in 0.297221 second(s) , Gzip On .

© 2016 Powered by mzan.com design MATCHINFO