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.
Permalink
Failed to load latest commit information.
app
config
public/javascripts
script
spec/javascripts
vendor/plugins/blue-ridge
.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