Извлеките данные из динамического файла Excel с помощью jQuery и отобразить их в HTML ⇐ Jquery

[Anonymous]

Вопрос :
Я пытаюсь извлечь определенные значения из файла Excel и отформатировать их в макет HTML с использованием jQuery. Вот что я стремлюсь достичь: < /p>

Выделите имена курсов < /li>
Показать ссылки на видео в виде кликабельных элементов < /li>
Групповые курсы к неделю < /li>
< /ol>
Я добился некоторого прогресса, но укоренился, когда пытался структурировать вывод. Может ли кто -нибудь помочь с примером кода или руководством о том, как это достичь? Не могли бы вы помочь мне с кодом и ожидаемым выводом? class = "Snippet-Code-JS Lang-JS PrettyPrint-Override">

Код: Выделить всё

$('#uploadExcel').on('change', function (e) {
const file = e.target.files[0];
const reader = new FileReader();

reader.onload = function (e) {
const data = new Uint8Array(e.target.result);
const workbook = XLSX.read(data, { type: 'array' });
const sheet = workbook.Sheets[workbook.SheetNames[0]];
const json = XLSX.utils.sheet_to_json(sheet, { header: 1 });

const highlights = [];
for (let i = 0; i < 5; i++) {
const row = json[i];
for (let j = 0; j < row.length - 1; j++) {
const key = row[j];
const value = row[j + 1];
if (key && value && key.includes("Highlight")) {
highlights.push({ type: key.trim(), title: value.trim() });
}
}
}

$('#highlightTable tbody').empty();
highlights.forEach(item => {
$('#highlightTable tbody').append(`${item.type}${item.title}`);
});

const courseData = json.slice(8).map(row => ({
course: row[1],
datetime: row[7]
})).filter(cd => cd.course);

const grouped = {};
courseData.forEach(cd => {
if (!grouped[cd.course]) grouped[cd.course] = [];
grouped[cd.course].push(cd.datetime);
});

const sortedCourses = Object.entries(grouped).sort((a, b) => new Date(a[1][0]) - new Date(b[1][0]));

$('#courseTable tbody').empty();
sortedCourses.forEach(([course, dates]) => {
const mergedDates = dates.sort((a, b) => new Date(a) - new Date(b)).join("
");
$('#courseTable tbody').append(`${course}${mergedDates}`);
});
};

reader.readAsArrayBuffer(file);
});< /code>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
padding: 8px;
}
th {
background-color: #f2f2f2;
}< /code>


Upload Excel File


Highlight Videos and Courses

TypeTitle



Sorted Courses

CourseDate/Time

Подробнее здесь: https://stackoverflow.com/questions/797 ... it-in-html