0

I am using angular-ui-grid version v3.0.0-rc.22-e8fe073. In a grid there are few merged columns and the column definition of merged column is as below:

mergedColumn :true, mergedColumnDisplayName :'Client Buy', name:'buy',field:'buy','displayName':'Amount',enableHiding: false

Below is the headertemplate being used:

$scope.sHeaderTemplate ='<div class="ui-grid-header"> \
                        <div class="ui-grid-top-panel">\
                        <div class="ui-grid-header-viewport">\
                        <div class="ui-grid-header-canvas">\
                        <div class="ui-grid-header-cell-wrapper" ng-style="colContainer.headerCellWrapperStyle()">\
                        <div class="ui-grid-header-cell-row">\
                        <div class="ui-grid-header-cell ui-grid-clearfix" ng-if="!col.grouping"\
                            ng-repeat="col in colContainer.renderedColumns track by col.uid"\
                         col="col" render-index="$index"  ng-class="{\'ui-grid-header-cell-merged\': col.colDef.mergedColumnDisplayName}" >\
                         <div  class="ui-grid-header-cell-merged-title">&nbsp; {{col.colDef.mergedColumnDisplayName}} </div> \
                        </div>\
                        </div>\
                        <div class="ui-grid-header-cell-row">\
                        <div class="ui-grid-header-cell ui-grid-clearfix" ng-if="!col.grouping"\
                            ng-repeat="col in colContainer.renderedColumns track by col.uid"\
                        ui-grid-header-cell col="col" render-index="$index">\
                        </div>\
                        </div>\
                        </div>\
                        </div>\
                        </div>\
                        </div>\
                        </div>';

And in a grid headerTemplate : $scope.sHeaderTemplate.

Columns are displayed properly on a webpage. Please find below screenshot:

merged column in a grid

Now, when I export this grid to .csv and open the .csv file in MS Excel, I am not getting merged columns.

How do I display merged columns from angular-ui-grid exported to csv in `MS Excel' ?

pnuts
  • 58,317
  • 11
  • 87
  • 139
Valay
  • 1,991
  • 2
  • 43
  • 98
  • There are no "merged columns" in the CSV format: it's a plain-text format with only values and separators. – Tim Williams Oct 12 '15 at 04:47
  • @TimWilliams - Ok then how do I display merged column label in csv/ms-excel ? – Valay Oct 12 '15 at 05:37
  • You will need to search for how to create an actual Excel file from your grid, or maybe try exporting an an HTML table and giving it an xls extension. E.g. see http://stackoverflow.com/questions/21680768/export-to-xls-using-angularjs – Tim Williams Oct 12 '15 at 05:48

1 Answers1

0

You can use ExceJS to create a merged cell, which sounds like what you are looking for.

Prathamesh Aware
  • 416
  • 4
  • 12