SheepIt! est un plugin jQuery permettant de cloner facilement des éléments de formulaires HTML (Ajouter un site web, nouveau numéro de téléphone ...)

Vous avez sans doute du développer des formulaires dans lesquels vos visiteurs doivent avoir la possibilité d'ajouter dynamiquement plusieurs champs comme ajouter un nouveau site web, ou téléphone ...

Grâce à SheepIt!, vous pourrez facilement mettre en place des formulaires aux champs dynamiques pour que vos visiteurs puissent facilement ajouter de nouvelles infos.

Son utilisation est simple, et plusieurs options sont disponibles pour configurer à votre guise l'ajout dynamiques de champs:

01.$(document).ready(function() {
02.
03.var sheepItForm = $('#sheepItForm').sheepIt({
04.separator: '',
05.allowRemoveLast: true,
06.allowRemoveCurrent: true,
07.allowRemoveAll: true,
08.allowAdd: true,
09.allowAddN: true,
10.maxFormsCount: 10,
11.minFormsCount: 0,
12.iniFormsCount: 2
13.});
14.
15.});

Et côté HTML:

01.<!-- sheepIt Form -->
02.<div id="sheepItForm">
03.
04.<!-- Form template-->
05.<div id="sheepItForm_template">
06.<label for="sheepItForm_#index#_phone">Phone <span id="sheepItForm_label"></span></label>
07.<input id="sheepItForm_#index#_phone" name="person[phones][#index#][phone]" type="text"/>
08.<a id="sheepItForm_remove_current">
09.<img class="delete" src="images/cross.png" width="16" height="16" border="0">
10.</a>
11.</div>
12.<!-- /Form template-->
13.
14.<!-- No forms template -->
15.<div id="sheepItForm_noforms_template">No phones</div>
16.<!-- /No forms template-->
17.
18.<!-- Controls -->
19.<div id="sheepItForm_controls">
20.<div id="sheepItForm_add"><a><span>Add phone</span></a></div>
21.<div id="sheepItForm_remove_last"><a><span>Remove</span></a></div>
22.<div id="sheepItForm_remove_all"><a><span>Remove all</span></a></div>
23.<div id="sheepItForm_add_n">
24.<input id="sheepItForm_add_n_input" type="text" size="4" />
25.<div id="sheepItForm_add_n_button"><a><span>Add</span></a></div></div>
26.</div>
27.<!-- /Controls -->
28.
29.</div>
30.<!-- /sheepIt Form -->

Il sera possible de contrôler le nombre minimum et maximum de champs à ajouter, d'activer ou non la possibilité de supprimer un champ ...

L'API intégrée au plugin vous permettra de contrôler à votre guise votre formulaire.

Plusieurs callbacks vous permettront d'étendre facilement le plugin selon vos besoins.

LIEN