Export data to xls using Angularjs in correct format

Question

I need to export data to an excel sheet using AngularJS(using version 1.5.x) I tried using FileSaver.js and Alasql from the solution given in the below link

Export to xls using angularjs

I have two problems.

I need the data in excel to be customized as in below screenshot :

Format required

The required bold headers and separate rows on the top of the table I could achieve using FileSaver, but it leads to the second point.

Javascript & HTML Code -

$scope.getFile = function () {
var blob = new Blob([document.getElementById('exportable').innerHTML], {
    type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8"});
    saveAs(blob, "ProgramsInfo.xls");
}

<a ng-click="getFile()" file-download="myBlobObject">Download Report</a><a>Share</a>
<div id="exportable" style="display:none;">
    <table width="100%" border="1">
        <thead>
          <tr><td>Client : {{client}}</td></tr>
          <tr><td>Program : {{programName}}</td></tr>
          <tr><td>Date Range : {{dateRange}}</td></tr>
          <tr>
              <th>Name</th>
              <th>E-mail</th>
              <th>DoB</th>
          </tr>
        </thead>
        <tbody>
            <tr ng-repeat="program in programs">
                <td>{{program.account_name}}</td>
                <td>{{program.e_mail ? 'Y':'N'}}</td>
                <td>{{program.dob | date:'MM/dd/yy'}}</td>
            </tr>
        </tbody>
    </table>
</div>

Getting an error when using Firefox which states that The file you are trying to open is in a different format than specified by the file extension...

![] [Firefox Error message]2

Can anyone help me with this?

I suggest you should be posting abit of your efforts Kritika for a better help. — StackUseR, Dec 01 '16 at 07:47

StackUseR · Answer 1 · 2016-12-01T10:03:33.797

0

Something like this can work if you're using alasql.

$scope.getFile = function () {
      alasql('SELECT * INTO XLSX("ProgramsInfo.xlsx",{headers:true}) FROM ?',[$scope.program]);
  };

Also, you can give a try here http://jsfiddle.net/agershun/00nfeq12/ and check this Export Html table to Excel.

And for the error that you get The file you are trying to open is in a different format than specified by the file extension..., its actually a security feature in Excel, introduced with Office 2007, that matches the content of the file and the file name extension.

That warning will show up when the security feature is enabled and it detects possible incompatibility between the actual content of the file and the file name extension, which can cause unexpected problems.

A registry key can be edited to stop the message from displaying.

Under HKEY_CURRENT_USER\Software\Microsoft\Office\12.0\Excel\Security Add a new DWORD Value called ExtensionHardening and set it's value to 0

edited Dec 01 '16 at 10:03

answered Dec 01 '16 at 09:42

StackUseR

884
1
11
40

I did try the above Alasql query (XLSX), it does not give the format error while the excel file is opened. However, it does not have the option for formatting the header contents to be bold which is a mandate as per my requirements. I also tried XLSXML query which gives the formatting option (header displays in bold) but also gives the format error while opening the downloaded file. Also tried the solution provided in the second link, get the same error. – Kritika Dec 01 '16 at 14:26
Well than I suggest you to use the `alasql` query only. Formatting stuff you can do it with some code. Also pls disable the MS security option so that you wont get the error. – StackUseR Dec 01 '16 at 15:13

Export data to xls using Angularjs in correct format

1 Answers1