TomWalbridge,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
td {
border: 1px solid #0000FF
}
</style>
</head>
<body>
<table id="mytable"></table>
<input type="text" id="fio">
<script>
const array = [{
sname: 'Сидоров',
fname: 'Иван',
lname: 'Михайлович',
bdate: '23.12.1990',
startlearn: '12.12.2005',
fac: 'Физики'
},
{
sname: 'Сидорова',
fname: 'Ивана',
lname: 'Михайловна',
bdate: '12.11.1994',
startlearn: '24.01.2006',
fac: 'Астрономии'
},
{
sname: 'Сорокина',
fname: 'Мария',
lname: 'Алексеевна',
bdate: '01.01.1992',
startlearn: '11.12.2008',
fac: 'Математики'
},
{
sname: 'Андропов',
fname: 'Александр',
lname: 'Петрович',
bdate: '3.10.1992',
startlearn: '13.12.2003',
fac: 'Информатики'
},
{
sname: 'Никифоров',
fname: 'Олег',
lname: 'Олегович',
bdate: '24.12.1995',
startlearn: '12.12.2004',
fac: 'Химии'
}
]
buildTable(array)
let inputFio = document.querySelector('#fio')
inputFio.addEventListener('input', function() {
let data = searchTable(this.value, array);
buildTable(data);
})
function searchTable(value, data) {
let filteredData = [];
value = value.toLowerCase();
for (let i = 0; i < data.length; i++) {
let sname = data[i].sname.toLowerCase();
if (sname.includes(value)) {
filteredData.push(data[i])
}
}
return filteredData
}
function buildTable(data) {
let table = document.getElementById('mytable')
table.innerHTML = ''
for (let i = 0; i < data.length; i++) {
let row = `
<tr>
<td>${data[i].sname + data[i].fname + data[i].lname}</td>
<td>${data[i].bdate}</td>
<td>${data[i].startlearn}</td>
<td>${data[i].fac}</td>
<tr/>
`
table.innerHTML += row
}
}
</script>
</body>
</html>
