| Script | Action | |||
|---|---|---|---|---|
| Bootstrap 4 CSS | https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css | copycopy script | ||
| Bootstrap 4 JS | https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js | copycopy script | ||
| Icons | https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.0.3/css/font-awesome.css | copycopy script | ||
| Jquery | https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js | copycopy script |
1 month ago
Adewunmi Agbato
@OmkarBailkeri This is wonderful. Simple to use and modify. More inspiration! How can i incorporate validation at each fieldset when next button is cclicked?
4 month's ago
Vivek Singh
it is really good brother... i would like to know how to prevent it from going to another page if fields are empty
7 month's ago
Kian Caliskan
Hi Omkar, howe make this form with validation? Thank you for any tips...
8 month's ago
Dimitris Klagkos
Hi @omkar-bailkeri83131 thanks for the code :) One small question. I have a rather large form, and in mobile view the user has to scroll down in order to fill in everything and go to the next step. When you press next though, you stay at the bottom of the page and you have to scroll up in order to see the new form. Is there a way to scroll at the top of the page when you press next/previous?
8 month's ago
Omkar Bailkeri
Hi @joe-58150 ! I m glad you liked my work. Now, for adding the fifth fieldset, just add another (li) and (fieldset) after the fourth one. Then set the CSS of (#progressbar li) by changing the width to 20%. This will solve your problem. Thank you :)
8 month's ago
Joe
Hi Omkar, great work you're doing here! I'm trying to add a fifth fieldset but the li appears below li's the other 's and I would like them to appear on one line. I have tried editing the css and js code but haven't been able to fix it yet. Any idea on how to accomplish this? Thanks!
8 month's ago
Joe
Hi Omkar, great work you're doing here! I'm trying to add a fifth fieldset but the appears below the other 's and I would like them to appear on one line. I have tried editing the css and js code but haven't been able to fix it yet. Any idea on how to accomplish this? Thanks!
Latest snippets
About this snippet
Bootstrap 4 Multi step form wizard snippet is created by Omkar Bailkeri using Bootstrap 4, Javascript. This snippet is free and open source hence you can use it in your project.Bootstrap 4 Multi step form wizard snippet example is best for all kind of projects.A great starter for your new awesome project with 1000+ Font Awesome Icons, 4000+ Material Design Icons and Material Design Colors at BBBootstrap.com.
Download limit exceeded
You have exceeded a daily download limit. BBBootstrap.com offers every user to download 3 snippets daily.Upgrade to download unlimited snippets!
Upgrade - Go Pro
Say Thanks to Omkar Bailkeri
Our creators love hear from you and seeing how you've used their snippets. Show your appreciation by donating and following.
Join BBBootstrap community
Contribute an awesome snippet to help other developer and designers
Add Comment/Questions