Bạn có thể thêm nhiều trường của form một lúc và SheepIt cũng cung cấp callbacks cho từng sự kiện (trước hoặc sau khi thêm trường).

Cách sử dụng

SheepIt làm việc với với phiên bản jQuery 1.4 hoặc cao hơn, do đó bạn cần thêm các file Javascript như sau:

 
<script type="text/javascript" src="jquery-1.4.min.js"></script>
<script type="text/javascript" src="jquery.sheepItPlugin-1.0.0.min.js"></script>

Mã 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
  });

});

Mã HTML mẫu như sau

 
<!-- 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 -->