BootstrapWizard - v0.1

Responsive wizard with expanding sub steps for Bootstrap 3

View project onGitHub

Designed as a clean wizard to be used in a Bootstrap Panel, a Modal, etc.



<div class="wizard">
    <ul class="nav nav-wizard">
            <a href="#step1">Step 1</a>

    <div class="wizard-pane" id="step1">
        <h3>Step 1</h3>


name type default description
width numeric null width of the wizard
height numeric 300 height of wizard
cancelButton boolean false display the cancel button
footerButtons boolean true display the footer buttons
progressBar boolean true display the progress bar
buttonText object
  cancel: "Cancel",
  next: "Next",
  back: "Back",
  submit: "Submit",
text for the buttons


method description
markAllVisited mark all nav items as visited
serialize serialize all the form data


event type description fired when a nav is selected but has not yet been displayed fires when the submit button is clicked

Inspired by Andrew Moffat's Bootstrap Application Wizard

Sub step collapse credit to Osman Nuri OkumuĊŸ MetisMenu