Javascript - как отобразить список элементов в зависимости от пользователя в строке поиска

У меня есть веб-страница django, где пользователь может зарегистрироваться и ниже есть таблица, которая отображает список пользователей из базы данных в таблице. Я создал окно поиска, когда пользователь вводит имя пользователя, это конкретное имя пользователя должно отражаться в таблице.Я пытаюсь сделать это с помощью Js скрипта, я не очень хорошо разбираюсь в js.Я пробовал, но не смог получить это.

html:

поиск:

<input type="text" id="myInput" placeholder="Search by name" class="form-control ng-pristine ng-valid ng-touched" onkeyup="myFunction()">

table:

js часть:

 <script>
    function myFunction() {
             input = document.getElementById("myInput");
    
    ul = document.getElementById("myUL");
    console.log(ul.textContent)
    li = ul.getElementsByTagName("td");
    console.log(li.textContent)
    for (i = 0; i < li.length; i++) {
        a = li[i].getElementsByTagName("td")[0];
        txtValue = a.textContent || a.innerText;
       
        }
    }

                                           

Я не совсем понимаю, что вы имеете в виду под "должно отражаться в таблице". Я пытаюсь понять ваш вопрос, поэтому если вы хотите найти имя пользователя, которое существует в одной из строк таблицы, вы должны перебирать строки или tr, а не столбцы или td. Вот пример того, что я пытаюсь указать.

Если в поле поиска ввести user1, будет выделена строка 1, и так далее.

Вернуться на верх