A snack table application that displays snack data in a table format. It provides various features such as searching, sorting, and dynamic updates based on user interactions.
- Display a table to show the snacks data, with columns for ID, Product Name, Product Weight, Price, Calories and Ingredients. The JSON to populate data for these columns have been provided below at the end.
- Create a search input field to allow users to filter the snacks by product name or ingredients, regardless of the case. Update the table dynamically as the user types in the search input to show only the products matching your search input.
- Sorting :
- Make all the table headers clickable to enable sorting (Ascending/Descending order) by the respective column. All the columns should have sorting functionality.
- Indicate that the header is clickable by showing a pointer or some CSS as per your wish.
- Update the displayed table dynamically when the sorting order changes.