¿Qué es SheepIt?
SheepIt es un plugin para Jquery que permite clonar elementos de formulario dinámicamente.
Es muy útil para desarrollar formularios avanzados que requieran cargar un mismo tipo de dato múltiples veces.
Por ejemplo, si se tiene un formulario como el siguiente: 
con el cual se cargan los datos de una persona (Nombre, Apellido y Teléfono), sheepIt es capaz transformar el campo teléfono en un multiformulario dinámico y asi habilitar al usuario a cargar más de un teléfono por persona. 
Además, para facilitar su uso, sheepIt agrega controles avanzados que le permiten al usuario modificar el formulario agregando o quitando clones dinámicamente.
Características
- Opciones de configuración
Limitar la cantidad de formularios, Controles de formulario customizables, cantidad de formularios iniciales, confirmación de borrado etc. - Controles avanzados
Agregar muchos formularios al mismo tiempo, Remover todos, Remover el último, son algunas de las formas que tiene SheepIt para facilitar al usuario el control de los clones. - Amigable para diseñadores
SheepIt toma como modelo para sus clones el mismo template que el diseñador puede ver en su editor, facilitando la actualización del diseño. - Inyección de datos
Gracias al método inject() de la API, sheepIt permite cargar un array de datos a todo el formulario, a un formulario embebido o a un clon específico.
El método realizará todas las operaciones necesarias para cargar los datos enviados, teniendo en cuenta los clones existentes y la configuración establecida. - Funciones callback
Las callBack functions sirven para ejecutar código personalizado antes o después de agregar un clon al formulario.
Esto sirve, por ejemplo, para establecer validaciones a los formularios clonados. - Formularios anidados
Una persona tiene múltiples domicilios y un domicilio tiene múltiples teléfonos.
Los formularios anidados permiten manejar este tipo de situaciones complejas. - Formularios pre-generados
SheepIt puede identificar clones pre-generados en el código html e incorporarlos como propios para poder manejarlos como al resto.
Esto es muy útil para interactuar con frameworks de formularios como el usado en Symfony para PHP. - API para controlar el formulario desde Javascript
El plugin expone una serie de métodos que permiten controlar el formulario mediante Javascript de la misma forma en la que el usuario lo controla en el navegador.
Requerimientos
Jquery V1.4+ Descargar
Ejemplo básico
Incluir archivos necesarios
<script type="text/javascript" src="jquery-1.4.min.js"></script>
<script type="text/javascript" src="jquery.sheepItPlugin-1.1.1.min.js"></script>
Código javascript
$(document).ready(function() {
var sheepItForm = $('#sheepItForm').sheepIt({
separator: '',
allowRemoveLast: true,
allowRemoveCurrent: true,
allowRemoveAll: true,
allowAdd: true,
allowAddN: true,
maxFormsCount: 10,
minFormsCount: 0,
iniFormsCount: 2
});
});
Plantilla HTML
<!-- sheepIt Form -->
<div id="sheepItForm">
<!-- Form template-->
<div id="sheepItForm_template">
<label for="sheepItForm_#index#_phone">Phone <span id="sheepItForm_label"></span></label>
<input id="sheepItForm_#index#_phone" name="person[phones][#index#][phone]" type="text"/>
<a id="sheepItForm_remove_current">
<img class="delete" src="images/cross.png" width="16" height="16" border="0">
</a>
</div>
<!-- /Form template-->
<!-- No forms template -->
<div id="sheepItForm_noforms_template">No phones</div>
<!-- /No forms template-->
<!-- Controls -->
<div id="sheepItForm_controls">
<div id="sheepItForm_add"><a><span>Add phone</span></a></div>
<div id="sheepItForm_remove_last"><a><span>Remove</span></a></div>
<div id="sheepItForm_remove_all"><a><span>Remove all</span></a></div>
<div id="sheepItForm_add_n">
<input id="sheepItForm_add_n_input" type="text" size="4" />
<div id="sheepItForm_add_n_button"><a><span>Add</span></a></div></div>
</div>
<!-- /Controls -->
</div>
<!-- /sheepIt Form -->