Вот код index.html
<html>
<head>
<meta charset="utf-8" />
<script src="https://code.jquery.com/jquery-2.1.4.js" integrity="sha256-siFczlgw4jULnUICcdm9gjQPZkw/YPDqhQ9+nAOScE4=" crossorigin="anonymous"></script>
<script lang="javascript" src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.16.7/xlsx.full.min.js"></script>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<div id="navbar"><span>SheetJS </span></div>
<div id="wrapper">
<input type="file" id="input-excel" />
</div>
<div id ="list_div"></div>
<script>
$('#input-excel').change(function(e){
var reader = new FileReader();
reader.readAsArrayBuffer(e.target.files[0]);
reader.onload = function(e) {
var data = new Uint8Array(reader.result);
var wb = XLSX.read(data,{type:'array'});
var sheet_name = wb.SheetNames[0];
var worksheet = wb.Sheets[sheet_name]
var patients = [];
var count_und = 0;
var index_cell = 6;
while(count_und < 2){
var adress_cell = 'A' + String(index_cell);
try {
patients.push({
'name' : worksheet['B' + String(index_cell)].v,
'history' : worksheet['C' + String(index_cell)].v,
'ward' : worksheet['D' + String(index_cell)].v,
'date_hosp' : worksheet['F' + String(index_cell)].v
});
count_und = 0;
} catch {
count_und += 1;
} finally {
index_cell += 1;
}
}
patients.sort(SortByWard);
var div = document.getElementById('list_div');
var wards = [];
for (var i = 0; i < patients.length; i++) {
var new_elem = document.createElement('div');
var ch_box_div = document.createElement('div');
ch_box_div.className = "checkbox_div"
div.appendChild(ch_box_div)
var ch_box = document.createElement('input');
ch_box.type = 'checkbox';
ch_box.name = "to_print"
ch_box.id = patients[i].history;
ch_box_div.appendChild(ch_box);
new_elem.innerText = patients[i].ward + " : " +
patients[i].name + " № истории: " +
patients[i].history + " Дата госпитализации: " +
patients[i].date_hosp;
div.appendChild(new_elem);
if (wards.indexOf(patients[i].ward) == -1) {
wards.push(patients[i].ward);
}
};
}
});
function SortByWard(a, b) {
return a.ward.toLowerCase() > b.ward.toLowerCase() ? 1 : -1;
};
</script>
</body>
</html>
styles.css
.checkbox_div {
display: inline-block;
}