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

Question

[coldunox]

У меня есть таблица


При помощи angular я могу удалять и редактировать сущность


Таблица с пользователями

<table class="table table-bordered table-hover table-striped">
                                            <thead>
                                                <tr>
                                                    <th>ФИО</th>
                                                    <th>Группа</th>
                                                    <th>Логин</th>
                                                    <th>Email</th>
                                                    
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <?php
                                                    foreach ($pageData['usersList'] as $key => $value) { ?>
                                                        <tr data-ng-click="showEditForm(); getUserData(<?php echo $value['id'];?>);">
                                                            <td><?php echo $value['fullName']; ?></td>
                                                            <td><?php echo $value['group_name']; ?></td>
                                                            <td><?php echo $value['login']; ?></td>
                                                            <td><?php echo $value['email']; ?></td>
                                                            
                                                        </tr>
                                                    <?php } ?>
                                            </tbody>
                                        </table>

Поисковая строка

<label class="col-md-4 control-label" for="newRole">Найти студента</label>
                            <input type="text" placeholder="Поиск студентов..." ng-model="searchText" class="form-control input-md"/>

Как создать фильтр по первой букве пользователя?

Comments

[Александр Токарчук]

От А до Я

Может нужна не фильтрация, а сортировка?

[coldunox]

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

[Александр Токарчук]

coldunox, тогда на свой вешай ajax. В нем обращайся к таблице студентов с фильтром

....
WHERE fullName LIKE '{данныеИзПоляВвода}%';
-- или  WHERE fullName LIKE '%{данныеИзПоляВвода}';
-- или  WHERE fullName LIKE '%{данныеИзПоляВвода}%';

Результат возвращаешь на страницу и перерисовываешь table

[Александр]

при загрузке страницы нужно ангуляру отдать не HTML а JSON
фильтр навесить обработчик на инпут, onchange делать users = users.filter(u => // ну и далее)
сортировка тут просто

users = users.sort((a, b) => {
  return a.fio.localeCompare(b.fio);
})

Answer 1

[Alex]

1. Для начала почитать про Angular
2. понять как он работает.
3. убрать <?php echo
4. сделать API
5. получить данные в json
6. вывести данные через *ngFor
7. сделать фильтр

Answer 2

[Артур]

Добавлю про сам фильтр, ибо Alex уже высказался об общей концепции.

Если данных для таблицы много, то для фильтра отправляй каждый раз запрос на сервер.
Если данных столько, что ты их видишь всегда сразу, то фильтруй просто в компоненте. *ngFor поможет.

Тебе потребуется знание bananaInTheBox [(ngModel)] https://angular.io/api/forms/NgModel