jQuery plugin to break a form up into pages based on the "fieldsets"
JavaScript Ruby
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


Welcome to Wizardize

This plugin takes a regular form and creates separate panels out of it based
on the fieldsets included in the page.

  • hides all but the first page
  • adds a list of “status buttons” as the first element in the form. Style as
    you see appropriate (or "form ol:first-child { display: none})
  • adds “next” and “previous” buttons to each panel
  • The regular submit button for the form is moved to the last panel.

That’s about it.

Getting Started

1. Download the code from


2. Include it in your page

3. Create a form with fieldsets separating out the different panels

4. Wizardize!



wizardize accepts an options hash. All values are optional:

  • statusButtonsTemplate: how the status buttons are named. Supports simple
    variable substitution: ‘$TITLE’ is the title tag of the fieldset, “$#” is
    the index of the fieldset. Therefore, to generate status buttons like
    “Step 3: provide your credentials”, use “Step $#: $TITLE”
  • statusButtonsSpacer: any html to add between the generated status buttons
    by default the status buttons are just an ordered list of the names of
    the panels
  • nextButton: name of the next button added to each panel. Defaults to ‘Next’.
  • prevButton: name of the previous button added to each panel. ‘Previous’,
  • nextCallback: function to be called when the user goes to the next panel


Run tests using:

rake spec:javascript