Using bootstrap forms and bootstrap validation.
The steps to replicate all functionality:
- The page loads with four input fields (and an image for wider screens).
- Each field is validated dynamically while the user inputs.
- After clicking on "Send" the first message on the button changes to "Sending..." and as it continues to take longer time a new message appears to let the user know it is still working on the submission (To show this effect, setTimeout() function has been used to delay the actual functionality for a few seconds).
- Once the form submission is complete, a success message appears on the page and the form fields are reset to default state.
- This success message automatically disappears after few seconds.
Libraries used: Bootstrap forms, Bootstrap Validator
Technologies: HTML, CSS, Bootstrap, Javascript and jQuery
To Run this project on your local machine:
- Clone the project using git clone https://github.com/vyerneni17/bootstrap-forms.git.
- Open the index.html file to see the site in action.