WF2 introduces a very convinient method to create repeating blocks.
This form can have an arbitrary number of fields, just click [Add Item] to add one more
The initial HTML look like this:
<form> <div id="row1" repeat="template"> <input type="text" name="product.[template1]" value=""><button type=remove>Remove</button> </div> <button type=add template=row1>Add Item</button> </form>
repeat="template" declares that the element is an template which can be repeated.
The new button types
remove is used for adding and removing instances of the template.
The template may contain several fields. Here is a slightly more complex example:
How does this look on the server side?
If the order of the items is important, two additional button types can be used for moving up and down:
The HTML is:
<button type=move-up>Up</button> <button type=move-down>Down</button>
By default, one instance based on the template is inserted in the document initially. This can be overridden by setting the
repeat-start attribute to a number.
(If the number is 0, no blocks is inserted initially). The attributes
repeat-max defines the minimum ans maximum allowed blocks.
This expample has
You can have nested repetition-elements: