title: How to add dynamically form fields with field type
body: <p>I want to make an add dynamically form fields with form fields type. The example is given below. </p>
  
  <p><a href="https://i.stack.imgur.com/JZ1Ye.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/JZ1Ye.png" alt="enter image description here"></a></p>
  
  <p>I have tried something below but need input type</p>
  
  <pre><code>$(function()
   {
    $(document).on('click', '.btn-add', function(e)
    {
      e.preventDefault();
  
      var controlForm = $('.controls form:first'),
          currentEntry = $(this).parents('.entry:first'),
          newEntry = $(currentEntry.clone()).appendTo(controlForm);
  
      newEntry.find('input').val('');
      controlForm.find('.entry:not(:last) .btn-add')
          .removeClass('btn-add').addClass('btn-remove')
          .removeClass('btn-success').addClass('btn-danger')
          .html('&lt;span class="glyphicon glyphicon-minus"&gt;&lt;/span&gt;');
  }).on('click', '.btn-remove', function(e)
  {
      $(this).parents('.entry:first').remove();
  
      e.preventDefault();
      return false;
     });
  });
  </code></pre>