Question

我正在开发一个项目，它有一堆带有相应模板和表单的视图。每个模板都包含一个指向登录页面的链接（从主模板继承）：

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

它会导致一个单独的登录页面，呈现标准的django登录表单。

我想使用jQuery在单击登录链接的同一页面上创建或显示该表单。将表单添加到多个页面的最佳方法是什么？

我试图获取html并使用ajax动态构建表单：

查看：

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)

脚本：

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

但我想知道，如果有更好的方法可以完成这项任务吗？

我也是jQuery的新手，所以我很感激代码的任何评论。

Answer 1

您可以将表单放入其自己的模板loginform.html中，然后使用＆＃34; include＆＃34;你想要的地方：

{% include './path-to/loginform.html' %}

编辑：这也是处理诸如css和javascript区域，导航菜单等内容的好方法。The Docs

将表单添加到多个页面的最佳方法？

1 个答案: