How to upload excel file in Javascript or convert excel to text file?

Question

I have been working on the upload page for text files, now I would like to upload excel files as well. My current code give me weird output. I assume something is wrong since my function was built for text files and now I have to modify something to read excel files. Here is my file reader code:

function fileSubmit(){
    var fileExist = $('#fileUpload')[0];
    var fileName = $('#fileUpload').val().split('\\').pop();

    if(fileName && fileExist){
        var reader = new FileReader();
        var file = fileExist.files[0];

        reader.onload = function(e) {
            var text = reader.result.split(/\r\n|\n/);                 
            var columnNames = text.shift().split('\t'); 
            alert(columnNames); 
        }
        reader.readAsText(file, 'UTF-8');
    }
}

My alert output looks like this:

PK!b�h^�[Content_Types].xml �(����N�0E�H�C�-Jܲ@5��*Q>�ēƪc[�ii����B�j7���{2��h�nm���ƻR����U^7/���%��rZY�@1__�f��q��R4D�AJ�h>����V�ƹ�Z�9����NV�8ʩ����ji){^��-

I want to output my columns names because I have to do the validation for each row in the file. What is the best way to get this to work for .xsl and .xsls files? I found many examples with xls and xlxs javascript libraries but none of them worked when I tried to implement for many reason. I'm wondering is there anything that is supported in all browsers or this is something that should not be done in JavaScript? Thank you.

An excel file is not just a standard text file, and can not be read as such. There is some encoding applied to the file - which is the reason for the garbage output. — Matt Clark
– Matt Clark, Commented Nov 18, 2016 at 18:52
Possible duplicate of How to parse Excel file in Javascript/HTML5 — Daniel Lizik
– Daniel Lizik, Commented Nov 18, 2016 at 18:52
None of these answers/functions working. I tried one that is accepted as an answer and I'm getting error 'Bolb'. — espresso_coffee
– espresso_coffee, Commented Nov 18, 2016 at 19:43

KishanCS · Accepted Answer · 2016-12-07 03:20:03Z

1

xlsx is internally xml files which is group of files together which is combined as xlsx .To check it open with zip and you can have a better view of what xlsx files are made of.

Xlsx Internally is [Opened with ZIP]

_

rels
docProps
xl
[content_types].xml

So these files internally work having dependent on relations. It is never a good practice to read xlsx file as text file. There are other methods you can read it using Apache poi library. Try it.And thank you...

answered Dec 7, 2016 at 3:20

KishanCS

1,3852 gold badges19 silver badges42 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Hariprakash Sambath · Accepted Answer · 2017-12-20 10:23:33Z

0

You can use XMLHttpRequest and FormData for uploading a file,

$('#input-file').change(function() {

      var url = '/back-end-url';
      var form_data = new FormData();
      var xhr = new XMLHttpRequest();

      $.each(this.files, function (key, value) {
          form_data.append('file', value)
      })

      xhr.open('POST', url, true)
      xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest")
      xhr.send(form_data)

      xhr.onreadystatechange(function() {
          if(xhr.readyState == XMLHttpRequest.DONE) {
               var res = JSON.parse(xhr.responseText)
          }
      })

})

You can get & handle the file in back-end.

answered Dec 20, 2017 at 10:23

Hariprakash Sambath

1791 silver badge5 bronze badges

Collectives™ on Stack Overflow

How to upload excel file in Javascript or convert excel to text file?

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related