Best way to add a form to multiple pages?
<p>I'm working on a project, that has a bunch of views with corresponding templates and forms. Every template contains a link to a login page (inherits it from the main template):</p>

<pre><code>&lt;ul class="options"&gt;
...
&lt;li id="login"&gt;
   &lt;a class="button" href="{% url 'forum:login' %}?next={{ request.path }}"&gt;Sign in&lt;/a&gt;
&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>And it leads to a separate login page, that renders standard django login form.</p>

<p>I want to use jQuery to create or make visible that form on the same page where login link was clicked. What is the best way to add a form to multiple pages? </p>

<p>I've tried to get html and build a form dynamically with ajax:</p>

<p><strong>view:</strong></p>

<pre><code>class Login(FormView):
...
    def get(self, request, *args, **kwargs):
        if request.is_ajax():
            form = self.get_form().as_ul()
            return HttpResponse(form)
        else:
            return super(Login, self).get(request, *args, **kwargs)
</code></pre>

<p><strong>script:</strong></p>

<pre><code>$(document).ready(function() {
$('#login').on('click', 'a', function(event) {
    var loginUrl = $(this).attr('href');
    $.ajax({
       url: loginUrl,
       type: 'GET'})
    .done(function(html) {
         var newForm = $('&lt;form/&gt;', {action: loginUrl, method: 'post'});
         newForm.insertAfter('ul.options');
         newForm.append($('&lt;input/&gt;',
              {type: 'hidden', name: 'csrfmiddlewaretoken', value: csrftoken}));
         var newList = $('&lt;ul/&gt;');
         newForm.append(newList);
         newList.append(html);
         newList.append($('&lt;li&gt;&lt;input type="submit" value="Sign in"/&gt;&lt;/li&gt;'));
    });
    event.preventDefault();
});
});
</code></pre>

<p>But I wonder, if there any better ways to complete such task?</p>

<p>Also I'm new to jQuery, so I'd appreciate any remarks on the code.</p>

<p>you can put your form in it's own template loginform.html and then use "include" where you want it with:</p>

<pre><code>{% include './path-to/loginform.html' %}
</code></pre>

<p>edit:
This is also a great way to handle things like your css and javascript areas, nav-menu, etc. <a href="https://docs.djangoproject.com/en/1.10/ref/templates/builtins/#include" rel="nofollow">The Docs</a></p>

jquery python ajax django