Table with Search and Sort using AngularJS and PHP
- Using directive to display values from variable and for sorting the list added an filter which takes the name of the column and sort order (asc or desc).
- The column variable contains the name of the default field by which table sort and the reverse variable store boolean value.
- Send service request to fetch records where pass search value, sort column, and sort order values as data.
- Click on the table header column name to sort and enter a value in the search box to filter list.
- If you are displaying static records using JSON on the page then you can directly use filter where pass the search expression and does not need to define ng-key directive.
Search filter makes easier to filter the list of records and view the only required records. This saves time when there is the huge number of records …
@yssyogesh_singh: Table with Search and Sort using #AngularJS and #PHP
Search filter makes easier to filter the list of records and view the only required records. This saves time when there is the huge number of records are available on the list.
There is already an orderBy filter is available on AngularJS which will be used for sorting the list.
In this tutorial, I am filtering MySQL table records while fetching data using AngularJS and PHP.
CREATE TABLE `employees` ( `id` int(11) NOT NULL PRIMARY KEY AUTO_INCREMENT, `emp_name` varchar(100) NOT NULL, `salary` varchar(50) NOT NULL, `gender` varchar(10) NOT NULL, `city` varchar(80) NOT NULL, `email` varchar(100) NOT NULL ) ENGINE=InnoDB DEFAULT CHARSET=latin1;
for database connection.