Basic Form Fields Repeater For jQuery - Repeater.js

File Size: 2.91 KB
Views Total: 57456
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Basic Form Fields Repeater For jQuery - Repeater.js

This is a dead simple jQuery based form repeater plugin which enables the user to add and remove any number of groups of form controls in an HTML form.

Works with any 3rd front-end frameworks such as Bootstrap 3, Bootstrap 4, Material Design Lite, Foundation, etc.

How to use it:

1. Create a group of repeatable form fields with a 'Remove' button in your HTML form.

<div class="items" data-group="test">
  <!-- Repeater Content -->
  <div class="item-content">
    <div class="form-group">
      <label for="inputEmail" class="col-lg-2 control-label">Name</label>
      <div class="col-lg-10">
        <input type="text" class="form-control" id="inputName" placeholder="Name" data-name="name">
    <div class="form-group">
      <label for="inputEmail" class="col-lg-2 control-label">Email</label>
      <div class="col-lg-10">
      <input type="text" class="form-control" id="inputEmail" placeholder="Email" data-skip-name="true" data-name="email">
  <!-- Repeater Remove Btn -->
  <div class="pull-right repeater-remove-btn">
      <button id="remove-btn" class="btn btn-danger" onclick="$(this).parents('.items').remove()">

2. Wrap the repeatable form group together with an 'Add' button into a container element.

<div id="repeater">
  <!-- Repeater Heading -->
  <div class="repeater-heading">
      <button class="btn btn-primary repeater-add-btn">
  <!-- Repeater Items -->
  <div class="items" data-group="test">
    <!-- Repeater Items Here -->

3. Insert jQuery JavaScript library and the jQuery Repeater.js script into the page.

<script src="" 
<script src="repeater.js"></script>

4. Call the function on the top container and the plugin will do the rest..






  • add textarea to repeatable items



  • remove button updates


  • Repeater default values improvements


  • Improvement

This awesome jQuery plugin is developed by vijaybajrot. For more Advanced Usages, please check the demo page or visit the official website.