Sort by columns: when you click on the name of a column, the table rows are sorted in ascending order, when you click again — in descending order. The sorting direction is indicated by a graphic element or a text message.
Client-side pagination: data must be displayed per page, maximum 50 items per page. You must provide custom navigation to navigate through the pages.
Filtering: the component provides a text field in which the user can enter text and table rows, the data of which does not contain the substring entered by the user, are hidden. Re-filtering is carried — ut by clicking on the "Find" button.
By clicking on a row in the table, the field values are displayed in an additional block below the table.
Data is loaded into the table from the server. Download method from the server of your choice.
Above the table there is a Create new reccord button, by clicking on which the form for adding a row drops out
Particular attention should be paid to the speed of work. Interface freezing during data loading, filtering, sorting operations is unacceptable.
When loading data, it is worth showing some kind of indicator
Using third-party libraries will be a plus only if it is justified and you can explain the reason for the choice. By showing your knowledge in the competent use of third-party ready-made solutions, you have a chance to increase your professional attractiveness for us.
Write the code the way you would write it at work — the internals of the assignment will be assessed even more carefully than the external compliance with the assignment. The code should be organized so that it can be reused.
Remember about error handling!
The layout can be the simplest. Make visualization and decoration to your taste. We are not against using Bootstrap or a similar UI framework, but only for the UI presentation (you cannot use JS code to solve the problem, but you can use it for design effects (animations, etc.))!
If selected by the user with ʻid = 101`, then below the table we display the following information:
Выбран пользователь <b>Sue Corson</b>
Описание:
<textarea>
et lacus magna dolor...
</textarea>
Адрес проживания: <b>9792 Mattis Ct</b>
Город: <b>Waukesha</b>
Провинция/штат: <b>WI</b>
Индекс: <b>22178</b>
During development libraries and frameworks were used