twitter-bootstrap Django - Ajax 模式登录/注册
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13394057/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Django - Ajax modal login/registration
提问by Pierre de LESPINAY
I have a project in which I need to pop a modal window for not authenticated users.
我有一个项目，我需要为未通过身份验证的用户弹出一个模式窗口。
This modal will allow to login directly orcreate an account.
此模式将允许直接登录或创建帐户。
So it will contain two forms:
所以它将包含两种形式：
django.contrib.auth.forms.AuthenticationFormregistration.forms.RegistrationForm
django.contrib.auth.forms.AuthenticationFormregistration.forms.RegistrationForm
Here is my view to get both forms:
这是我对两种形式的看法：
def ajax_registration(request):
obj = {
'login_form': AuthenticationForm(),
'registration_form': RegistrationForm(),
}
return render(request, 'common/ajax_registration.html', obj)
And my template displaying the forms tabbed
我的模板显示选项卡式表单
<ul class="nav nav-tabs">
<li><a href="#tab1" data-toggle="tab">{% trans 'Login' %}</a></li>
<li><a href="#tab2" data-toggle="tab">{% trans 'Registration' %}</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="tab1">
{{ login_form|bootstrap }}
</div>
<div class="tab-pane" id="tab2">
{{ registration_form|bootstrap }}
</div>
</div>
Question is: Since I'm using ajax to display this modal, How can I validate the selected form, preferably using the already written django-registrations register& django.contrib.auth loginviews ?
问题是：由于我使用 ajax 来显示此模式，如何验证所选表单，最好使用已编写的django-registrations register&django.contrib.auth login视图？
采纳答案by Density 21.5
In addition to Maddog's answer you need some javascript to submit the form back to the URL that rendered the form. Using jquery it could be something like:
除了 Maddog 的回答之外，您还需要一些 javascript 来将表单提交回呈现表单的 URL。使用 jquery 它可能是这样的：
$('form').submit(function(e){
e.preventDefault();
var form = $(e.target);
$.ajax({
url: '{% url YOUR_REGISTRATION_URL %}',
type: 'post',
data: account_form.serialize() + '&' + form.serialize(),
error: function(xhr, ajaxOptions, thrownError){ alert(thrownError); },
success: function(){}
})
})
You don't need to do it with a form submit element, you could use any element with $().click(), of course.
您不需要使用表单提交元素来执行此操作，当然，您可以将任何元素与 $().click() 一起使用。
回答by Maddog
Something like this?
像这样的东西？
def ajax_registration(request):
login_form, registration_form = False, False
if request.method == "POST":
if "email" in request.POST: # some condition to distinguish between login and registration form
login_form = AuthenticationForm(request.POST)
if login_form.is_valid():
# log in
else:
registration_form = RegistrationForm(request.POST)
if registration_form.is_valid():
# register
obj = {
'login_form': login_form if login_form else AuthenticationForm(),
'registration_form': registration_form if registration_form else RegistrationForm(),
}
return render(request, 'common/ajax_registration.html', obj)
