Merge 2 arrays using JavaScript and export it to xls file

Question

I know this question may have been asked before but I could not find any answer that can help me with the requirement.

I need to merge the 2 arrays and export them to Excel file and we need to fulfill this only with JavaScript/jquery. Let's suppose there are 2 arrays as below :

Array 1 : ["Item 1", "Item 2"]

Array 2 : ["Item 3", "Item 4"]

so when I merge/concat them, Final array looks like ["Item 1", "Item 2", "Item 3", "Item 4"]

But I want it to display the like below in exported file:

Can you please help me with this ?

You could have a look at this [answer](https://stackoverflow.com/questions/333537/how-to-generate-excel-through-javascript) — varun agarwal, Feb 21 '19 at 08:10

score 1 · Answer 1 · answered Feb 21 '19 at 08:11

1

You can merge the two arrays using only concat:

var array1 = ["Item 1", "Item 2"];
var array2 = ["Item 3", "Item 4"];
var merged = array1.concat(array2);

console.log(merged);

Exporting to XLS is a little harder, but thankfully there's a well-maintained library for it: Excellent Export.

There's also an excellent post written by tripathy here that has a function purpose-built for making XLS/XLSX files.

answered Feb 21 '19 at 08:11

Jack Bashford

43,180
11
50
79

Concat does show the items the way I want. I want to show array1 in 1st column and array2 in second column (Join the arrays horizontly). Please read the question again. – Ravi Feb 21 '19 at 09:45
The merged array is exactly the same as the merged array you want - you said, and I quote, ` Final array looks like ["Item 1", "Item 2", "Item 3", "Item 4"]`.` – Jack Bashford Feb 21 '19 at 09:57
Please check the image how I want it to look like in exported file. With this approach it will be in 1 column only. – Ravi Feb 21 '19 at 09:58

Shohel · Answer 2 · 2019-02-21T11:57:37.510

Try to use this, If your data format looks like that. I think CSV is the best rather than excel. Follow the second solution without JavaScript library dependency.

Solution 1

var array1 = ["Item 1", "Item 3"];
var array2 = ["Item 2", "Item 4"];
let noDuplicate = array1.filter(i => array2.findIndex(a => i == a) == -1);
let result = [...noDuplicate, ...array2];
console.log(result);
exportToExcel = function() {
  var myJsonString = JSON.stringify(result);
  var blob = new Blob([myJsonString], {
    type: "application/vnd.ms-excel;charset=utf-8"
  });
  saveAs(blob, "Report.xls");
};

Solution 2, Without FileSaver.js

var Results = [array1, array2];
exportToCsv = function() {
  var CsvString = "";
  Results.forEach(function(RowItem, RowIndex) {
    RowItem.forEach(function(ColItem, ColIndex) {
      CsvString += ColItem + ",";
    });
    CsvString += "\r\n";
  });
  CsvString = "data:application/csv," + encodeURIComponent(CsvString);
  var x = document.createElement("A");
  x.setAttribute("href", CsvString);
  x.setAttribute("download", "somedata.csv");
  document.body.appendChild(x);
  x.click();
};

You can find the saveAs method to the following JavaScript file, add this JavaScript file to your application. https://github.com/eligrey/FileSaver.js/blob/master/src/FileSaver.js

DEMO

PLease see the image in question. Exported data is nowhere close to that. — Ravi, Feb 21 '19 at 11:48

Merge 2 arrays using JavaScript and export it to xls file

2 Answers2

Solution 1

Solution 2, Without FileSaver.js