title: How do I create a new form in inline formset by clicking a link
body: <p>I created an inline relation between <strong>Reader</strong> and <strong>Book</strong> models.
  I imported the formset in my template successfully but I can not create a new Book form by clicking a link related to my <strong>addtext</strong> attribute in the below script. <strong>In otherwords, for one Reader I want to be able to create more than one Book form by clicking a link.</strong></p>
  
  <pre><code>   &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script src="{% static 'jquery.formset.js' %}"&gt;&lt;/script&gt;
      &lt;script type="text/javascript"&gt;
        $('table.book tr.formset_row').formset({
            addText: 'Add new Book',
            deleteText: 'Delete',
            prefix: 'reader_book_set',
            animateForms: true
        });
      &lt;/script&gt;
  </code></pre>
  
  <p>The whole template is this:</p>
  
  <pre><code>{% extends 'base.html' %}
  {% load bootstrap3 %}
  {% load static %}
  &lt;!-- Latest compiled and minified JavaScript --&gt;
  
  
  {% block content %}
  
  &lt;div class="col-md-12 text-center"&gt;
  &lt;h2&gt;Create / Edit Reader &lt;/h2&gt;
  &lt;/div&gt;
  
  &lt;hr&gt;
  
  &lt;form class="well" method="post" action=""&gt;
  {% csrf_token %}
  {% bootstrap_form form %}
  
  &lt;table class="table book"&gt;
    {{ formset.management_form }}
  
    {% for form in formset.forms %}
        {% if forloop.first %}
            &lt;thead&gt;
            &lt;tr&gt;
                {% for field in form.visible_fields %}
                    &lt;th&gt;{{ field.label|capfirst }}&lt;/th&gt;
                {% endfor %}
            &lt;/tr&gt;
            &lt;/thead&gt;
        {% endif %}
        &lt;tr class="{% cycle row1 row2 %} formset_row"&gt;
            {% for field in form.visible_fields %}
                &lt;td&gt;
                    {# Include the hidden fields in the form #}
                    {% if forloop.first %}
                        {% for hidden in form.hidden_fields %}
                            {{ hidden }}
                        {% endfor %}
                    {% endif %}
                    {{ field.errors.as_ul }}
                    {{ field }}
                &lt;/td&gt;
            {% endfor %}
        &lt;/tr&gt;
    {% endfor %}
  &lt;/table&gt;
  
  
  &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="{% static 'jquery.formset.js' %}"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
    $('table.book tr.formset_row').formset({
        addText: 'Add new Book',
        deleteText: 'Delete',
        prefix: 'reader_book_set',
        animateForms: true
    });
  &lt;/script&gt;
  
      {% buttons %}
        &lt;button type="submit" class="btn btn-primary"&gt;
           Submit
        &lt;/button&gt;
      {% endbuttons %}
  &lt;/form&gt;
  &lt;hr&gt;
  
  {{ form.media }}
  &lt;link rel="stylesheet" type="text/css" href="{% static 'admin/css/forms.css' %}"/&gt;
  &lt;link rel="stylesheet" type="text/css" href="{% static 'admin/css/base.css' %}"/&gt;
  &lt;link rel="stylesheet" type="text/css" href="{% static 'admin/css/widgets.css' %}"/&gt;
  &lt;script type="text/javascript" src="/admin/jsi18n/"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="/static/admin/js/core.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="/static/admin/js/admin/RelatedObjectLookups.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="/static/admin/js/vendor/jquery/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="/static/admin/js/jquery.init.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="/static/admin/js/actions.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="/static/admin/js/calendar.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="/static/admin/js/admin/DateTimeShortcuts.js"&gt;&lt;/script&gt;
  
  {% endblock %}
  </code></pre>
  
  <p>Here is my view:</p>
  
  <pre><code>class ReaderBookCreateView(LoginRequiredMixin, CreateView):
      model = Reader
      fields = '__all__'
      template_name='test/test.html'
  
      def get_context_data(self, **kwargs):
          data = super(ReaderBookCreateView, self).get_context_data(**kwargs)
          if self.request.POST:
              data['formset'] = BookFormSet(self.request.POST)#bound the formset with data
          else:
              data['formset'] = BookFormSet()#empty formset
          return data
  
      def form_valid(self, form):
          context = self.get_context_data()
          formset = context['formset']
          with transaction.atomic():
              self.object = form.save()
  
              if formset.is_valid():
                  formset.instance = self.object
                  formset.save()
          return super(ReaderBookCreateView, self).form_valid(form)
  
      def get_success_url(self, **kwargs):
          return reverse('client_list')
  </code></pre>
  
  <p>Here is how it looks. I would like to have a link <strong>Add new Book</strong> above the submit button for creation of the new Book form for the current reader.
  <a href="https://i.stack.imgur.com/1Eavu.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/1Eavu.png" alt="enter image description here"></a></p>
  
  <p>Any help will be appreciated.</p>