jQuery plugin to break a form up into pages based on the "fieldsets"
JavaScript Ruby
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
app
config
public/javascripts
script
spec/javascripts
vendor/plugins/blue-ridge Upgrade blue ridge. Apr 7, 2010
.gitignore
README.textile
Rakefile

README.textile

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

http://github.com/ndp/wizardize/raw/master/public/javascripts/jquery/jquery.wizardize.js

2. Include it in your page

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

4. Wizardize!

$(‘form’).wizardize();

Options

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

Development

Run tests using:

rake spec:javascript