Как сделать поиск по таблице?

Ссылка скопирована
1 ответ

Допустим у меня есть таблица, куда данные я подгружаю из API, я хочу сделать поиск по ней. Что мне для этого нужно сделать ? Нужно ли что-то делать на бэке и/или в базе данных ?

Дополнительно:

Что мне для этого нужно сделать ?

Вам нужно написать немного кода.

Нужно ли что-то делать на бэке и/или в базе данных ?

Если таблица без пагинации и вся информация выгружается сразу на одну страницу, то можно и на фронте реализовать
Если есть пагинация, то эффективнее на беке

  • спасибо, восприниму это положительно

    Вам нужно написать немного кода.

    . Я просто думал нужно как-то базу ковырять или бэк.

  • holllop,
    Ковырять что базу, что бек, что фронт, все сходится к одному - писать код:
    Или на фронте
    Или на беке, не трогая бд (фильтруя выборку из бд)
    Или на беке, изменяя запрос к бд (в выборку добавить фильтрацию, путем WHERE ...)

    Но именно в самой бд (хоть я и не знаю вашу структуру, но предположим, что возможности позволяют), обычно ничего не трогают

Гуглите в сторону DataTables, есть клиент-серверные варианты вроде такого https://datatables.net/, есть просто клиентские библиотеки на js вроде такой https://www.tablefilter.com/

Изобретать велосипед имеет смысл только в учебных целях, не более того.

  • да мне для обучения хочу научиться взаимодействию бэка(написанного собой и фронта написанного собой). Но ссылки считаю полезными
Нужно решить такую задачу?

Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

Заказать помощь
Лучший ответ
1
Сергей Миронов Ответ

Для того чтобы реализовать поиск по таблице веб-приложения, необходимо использовать JavaScript в сочетании с HTML и CSS. Ниже приведен пример кода, демонстрирующий простой поиск по таблице с использованием JavaScript:

HTML:
```html

Поиск по таблице

Имя Фамилия Возраст
Иван Иванов 25
Петр Петров 30

```

JavaScript (search.js):
```javascript
function searchTable() {
var input, filter, table, tr, td, i, txtValue;
input = document.getElementById("searchInput");
filter = input.value.toUpperCase();
table = document.getElementById("myTable");
tr = table.getElementsByTagName("tr");

for (i = 0; i < tr.length; i++) {
td = tr[i].getElementsByTagName("td");
for (var j = 0; j

-1) {
tr[i].style.display = "";
break;
} else {
tr[i].style.display = "none";
}
}
}
}
}
```

Этот код создает таблицу с тремя столбцами (Имя, Фамилия, Возраст) и поле ввода для поиска. При вводе текста в поле ввода, JavaScript будет скрывать строки таблицы, которые не соответствуют введенному тексту.

Вы можете адаптировать этот код под свои потребности, например, добавив больше столбцов, изменяя стили или расширяя функциональность поиска. Надеюсь, это поможет вам реализовать поиск по таблице в вашем веб-приложении.

Другие ответы (0)

Пока нет других ответов. Будьте первым, кто поможет автору.

Ответить на вопрос

комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Вам также может быть интересно