Employee Directory
Summary
Employee Directory used a random user API to generate random users and generate their details. Clicking a user would pop up a modal for additional information.
Motivation
The purpose of this project was to understand more about communicating with a third-party API using JQuery.
Getting Started
- Click the demo link or clone/download the repository on your local machine and open the index.html file with a browser.
- Click the employee/employee information in the grid to open a modal window with more detailed information.The modal window can be closed by clicking outside the modal.
- Enter the name of employee in the search box to filter the directory by employee name.
Thoughts
I am still not sure how can I use javascript to call an event listener on dynamically added elements.
Built With
- HTML5
- CSS3
- JQUERY
- AJAX
- API
Features
1. Responsive Design
2. Compatible on Chrome 68.0.3440.106 and Firefox 62.0(64-bit)
3. Hover state employee information
4. Search functionality to filter the directory by name
5. Flexbox layout
Coming Soon
- Add a way to move back and forth between employee detail windows when the modal window is open.
- Closing the modal by clicking the dynamically added element rather that clicking outside the box.