Excel to JSON javascript code?
2 answers
Nota: O navegador cruzado não é 100%
Como você vai ver as pessoas tiveram problemas com os navegadores não tão comuns, mas isso pode vir para a versão do navegador.. Eu sempre recomendo usar algo como caniuse para ver que Geração de navegador é suportada... Esta é apenas uma resposta de trabalho para o Usuário, não um código final de cópia e colagem para as pessoas apenas usarem..
O Violino: http://jsfiddle.net/d2atnbrt/3/
O CÓDIGO HTML:
<input type="file" id="my_file_input" />
<div id='my_file_output'></div>
O CÓDIGO JS:
var oFileIn;
$(function() {
oFileIn = document.getElementById('my_file_input');
if(oFileIn.addEventListener) {
oFileIn.addEventListener('change', filePicked, false);
}
});
function filePicked(oEvent) {
// Get The File From The Input
var oFile = oEvent.target.files[0];
var sFilename = oFile.name;
// Create A File Reader HTML5
var reader = new FileReader();
// Ready The Event For When A File Gets Selected
reader.onload = function(e) {
var data = e.target.result;
var cfb = XLS.CFB.read(data, {type: 'binary'});
var wb = XLS.parse_xlscfb(cfb);
// Loop Over Each Sheet
wb.SheetNames.forEach(function(sheetName) {
// Obtain The Current Row As CSV
var sCSV = XLS.utils.make_csv(wb.Sheets[sheetName]);
var oJS = XLS.utils.sheet_to_row_object_array(wb.Sheets[sheetName]);
$("#my_file_output").html(sCSV);
console.log(oJS)
});
};
// Tell JS To Start Reading The File.. You could delay this if desired
reader.readAsBinaryString(oFile);
}
Isto também requer https://cdnjs.cloudflare.com/ajax/libs/xls/0.7.4-a/xls.js para converter para um formato legível, eu também usei jquery apenas para alterar o conteúdo div e para o evento dom ready.. então o jquery não é necessário
Isto é o mais básico que consegui.Editar gerar uma tabela
O Violino: http://jsfiddle.net/d2atnbrt/5/
Este segundo violino mostra um exemplo de gerando sua própria tabela, a chave aqui está usando sheet_to_json para obter os dados no formato correto para uso JS.. Um ou dois comentários no segundo violino pode estar incorrecto como versão modificada do primeiro violino.. o comentário do CSV é pelo menosTeste do ficheiro XLS: http://www.whitehouse.gov/sites/default/files/omb/budget/fy2014/assets/receipts.xls
Isto não cobre os ficheiros XLSX pensados, deve ser bastante fácil de ajustar para eles usando o seu exemplo.
A biblioteca Js-xlsx facilita a conversão de ficheiros Excel/CSV em objectos JSON.
Descarrega o xlsx.total.minuto.js file from here. Escreva abaixo do código na sua página HTML Edite a ligação de ficheiro JS referenciada (xlsx.total.minuto.js) e link do arquivo Excel
<!doctype html>
<html>
<head>
<title>Excel to JSON Demo</title>
<script src="xlsx.full.min.js"></script>
</head>
<body>
<script>
/* set up XMLHttpRequest */
var url = "http://myclassbook.org/wp-content/uploads/2017/12/Test.xlsx";
var oReq = new XMLHttpRequest();
oReq.open("GET", url, true);
oReq.responseType = "arraybuffer";
oReq.onload = function(e) {
var arraybuffer = oReq.response;
/* convert data to binary string */
var data = new Uint8Array(arraybuffer);
var arr = new Array();
for (var i = 0; i != data.length; ++i) arr[i] = String.fromCharCode(data[i]);
var bstr = arr.join("");
/* Call XLSX */
var workbook = XLSX.read(bstr, {
type: "binary"
});
/* DO SOMETHING WITH workbook HERE */
var first_sheet_name = workbook.SheetNames[0];
/* Get worksheet */
var worksheet = workbook.Sheets[first_sheet_name];
console.log(XLSX.utils.sheet_to_json(worksheet, {
raw: true
}));
}
oReq.send();
</script>
</body>
</html>
Entrada:
Resultado: