Scenario:
Building web forms can be tricky when a form calls for a variable number of fields. A real-world example might be a sports team with an n number of players. When capturing the team player data via a web form, the typical way might be to create the form with one empty player field for each player on the team. You would obviously need to know the maximum number of players per team. Worse, you would also need to deal with non-existant form data on the server side.

Solution:
A more dynamic way is to show just the single player field with a button to add extra player fields for the n number of players on the team.
To support this solution, I’ve written a jQuery plugin that will duplicate, on-demand, any field or group of fields set within a <FIELDSET> tag. You can use the plugin to create one or more dynamic fields per form or in a group of forms.

Demo:
Click here for a demo of a dynamic form powered by jQuery.

*It’s a jQuery plugin so it can be chained to other jQuery events, effects or plugins.

Download:
Source code here: jquery.dynamicForm.js (56)
Minified code here: jquery.dynamicForm.min.js (32)