rakibulhaq · February 26, 2019 07:23
diff --git a/XLSXchooseSheet.html b/XLSXchooseSheet.html
 <html>

 <head>
 	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
 	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
 	<script src="libraries/PapaParse-4.1.2/papaparse.min.js"></script>
 	<script src="libraries/xlsx/xlsx-0.8.0.core.min.js"></script>
 	<script src="libraries/bootstrap/js/bootstrap-4.0.0.min.js"></script>
 	<link rel="stylesheet" href="libraries/bootstrap/css/bootstrap-4.0.0.min.css">
 	<script src="libraries/bootstrap.file-input.js"></script>

 	<script>
 		function xlsxToJson(workbook, sheetName) {
 			var csv = XLSX.utils.sheet_to_csv(workbook.Sheets[sheetName]);
 			var results = Papa.parse(csv, {
 				header: true,
 				skipEmptyLines: true,
 				dynamicTyping: true
 			});
 			if (results.errors.length != 0) {
 				alert("Something doesn't work with this file");
 				throw new Error(results.error);
 			}
 			return (results.data)
 		}
 	</script>

 	<script>
 		$(document).ready(function() {

 			$('input[type=file]').bootstrapFileInput();

 			var re = /(?:\.([^.]+))?$/;

 			$("#xlsxfile").on("change", function() {
 				var myfile = $("#xlsxfile")[0].files[0];
 				if (re.exec(myfile.name)[1] != "xlsx") {
 					alert("This is not a xlsx file!");
 					throw new Error("extension != 'xlsx'");
 				}
 				var reader = new FileReader();

 				reader.onload = function(e) {
 					try {
 						var workbook = XLSX.read(reader.result, {
 							type: 'binary'
 						});
 					} catch (err) {
 						alert("Something is wrong with this xlsx file");
 						throw new Error(err);
 					}
 					var sheetNames = workbook.SheetNames;
 					// create the dropdown list
 					if (sheetNames.length < 3) {
 						var size = sheetNames.length;
 					} else {
 						var size = 3;
 					}
 					$('#selectSheet').attr('size', size);
 					$(sheetNames).each(function(index, item) {
 						$('#selectSheet').append($("<option>").attr('value', index).text(item));
 					});
 					$('#selectSheet option[value=0]').prop('selected', true);
 					$('#containerSelectSheet').show();
 					// submit action
 					$('#submitSheet').click(function() {
 						var json = xlsxToJson(workbook, $("#selectSheet option:selected").text());
 						$('#sheetJson').text(JSON.stringify(json));
 						$('#containerSheetJson').show();
 					});
 				}

 				reader.onerror = function(err) {
 					alert("I can't read this file!");
 					throw new Error(err);
 				};

 				reader.readAsBinaryString(myfile);

 			})
 		})
 	</script>

 </head>

 <body>

 	<form id="xlsxform" method="post" enctype="multipart/form-data">
 		<label for="xlsxfile" class="control-label">Select a XLSX file</label>
 		<input id="xlsxfile" type="file" data-filename-placement="inside" class="btn-primary">
 	</form>

 	<div class="container" id="containerSelectSheet" style="display:none">
 		<div class="row">
 			<div class="col-sm-3">
 				<fieldset id="selectSheetFieldset">
 					<label for="selectSheet" style="color:blue">Select a sheet</label>
 					<select class="form-control" id="selectSheet" style="overflow-y:auto"></select>
 				</fieldset>
 			</div>
 			<div class="col-sm-3">
 				<button id="submitSheet" type="button" class="btn-primary">Submit</button>
 			</div>
 			<div class="col-sm-6"></div>
 		</div>
 	</div>

 	<div class="container" id="containerSheetJson" style="display:none">
 		<p>
 			<h3>Your sheet in JSON:</h3>
 		</p>
 		<p id="sheetJson"></p>
 	</div>
 	<br>

 </body>

 </html>
	<html>

	<head>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
	<script src="libraries/PapaParse-4.1.2/papaparse.min.js"></script>
	<script src="libraries/xlsx/xlsx-0.8.0.core.min.js"></script>
	<script src="libraries/bootstrap/js/bootstrap-4.0.0.min.js"></script>
	<link rel="stylesheet" href="libraries/bootstrap/css/bootstrap-4.0.0.min.css">
	<script src="libraries/bootstrap.file-input.js"></script>

	<script>
	function xlsxToJson(workbook, sheetName) {
	var csv = XLSX.utils.sheet_to_csv(workbook.Sheets[sheetName]);
	var results = Papa.parse(csv, {
	header: true,
	skipEmptyLines: true,
	dynamicTyping: true
	});
	if (results.errors.length != 0) {
	alert("Something doesn't work with this file");
	throw new Error(results.error);
	}
	return (results.data)
	}
	</script>

	<script>
	$(document).ready(function() {

	$('input[type=file]').bootstrapFileInput();

	var re = /(?:\.([^.]+))?$/;

	$("#xlsxfile").on("change", function() {
	var myfile = $("#xlsxfile")[0].files[0];
	if (re.exec(myfile.name)[1] != "xlsx") {
	alert("This is not a xlsx file!");
	throw new Error("extension != 'xlsx'");
	}
	var reader = new FileReader();

	reader.onload = function(e) {
	try {
	var workbook = XLSX.read(reader.result, {
	type: 'binary'
	});
	} catch (err) {
	alert("Something is wrong with this xlsx file");
	throw new Error(err);
	}
	var sheetNames = workbook.SheetNames;
	// create the dropdown list
	if (sheetNames.length < 3) {
	var size = sheetNames.length;
	} else {
	var size = 3;
	}
	$('#selectSheet').attr('size', size);
	$(sheetNames).each(function(index, item) {
	$('#selectSheet').append($("<option>").attr('value', index).text(item));
	});
	$('#selectSheet option[value=0]').prop('selected', true);
	$('#containerSelectSheet').show();
	// submit action
	$('#submitSheet').click(function() {
	var json = xlsxToJson(workbook, $("#selectSheet option:selected").text());
	$('#sheetJson').text(JSON.stringify(json));
	$('#containerSheetJson').show();
	});
	}

	reader.onerror = function(err) {
	alert("I can't read this file!");
	throw new Error(err);
	};

	reader.readAsBinaryString(myfile);

	})
	})
	</script>

	</head>

	<body>

	<form id="xlsxform" method="post" enctype="multipart/form-data">
	<label for="xlsxfile" class="control-label">Select a XLSX file</label>
	<input id="xlsxfile" type="file" data-filename-placement="inside" class="btn-primary">
	</form>

	<div class="container" id="containerSelectSheet" style="display:none">
	<div class="row">
	<div class="col-sm-3">
	<fieldset id="selectSheetFieldset">
	<label for="selectSheet" style="color:blue">Select a sheet</label>
	<select class="form-control" id="selectSheet" style="overflow-y:auto"></select>
	</fieldset>
	</div>
	<div class="col-sm-3">
	<button id="submitSheet" type="button" class="btn-primary">Submit</button>
	</div>
	<div class="col-sm-6"></div>
	</div>
	</div>

	<div class="container" id="containerSheetJson" style="display:none">
	<p>
	<h3>Your sheet in JSON:</h3>
	</p>
	<p id="sheetJson"></p>
	</div>
	<br>

	</body>

	</html>