ajax - Django - Ajax 模式登录/注册

标签 ajax django twitter-bootstrap django-templates django-registration

我有一个项目,我需要为未经过身份验证的用户弹出一个模式窗口。

此模式将允许直接登录 创建一个帐户。

所以它将包含两种形式:

  • django.contrib.auth.forms.AuthenticationForm
  • registration.forms.RegistrationForm

  • Modal tabbed forms

    这是我对两种形式的看法:
    def ajax_registration(request):
        obj = {
            'login_form': AuthenticationForm(),
            'registration_form': RegistrationForm(),
        }
        return render(request, 'common/ajax_registration.html', obj)
    

    我的模板显示了选项卡式的表单
    <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>
    

    问题是:由于我使用 ajax 来显示此模式,如何验证所选表单,最好使用已经写好的 django-registrations register & django.contrib.auth login 意见?

    最佳答案

    除了 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(){}
            })
     })
    

    您不需要使用表单提交元素来执行此操作,当然,您可以使用任何带有 $().click() 的元素。

    关于ajax - Django - Ajax 模式登录/注册,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13394057/

    相关文章:

    ajax - HTTP 请求在 Chrome 版本 48 中无响应

    python - 如何从上下文中获取 View 中对象的id?

    jquery - bootstrap contact_me 从另一个按钮提交

    twitter-bootstrap - Twitter bootstrap,在移动设备上将图像拉伸(stretch)到全屏

    javascript - jQuery ajax 从另一台服务器加载 html

    javascript - AJAX - 使用 JSON 与回显 HTML

    javascript - 在不刷新页面的情况下更新网站的 CSS

    python - 具有 unique_together 约束的 django rest 序列化程序中的 read_only 字段

    python - 在 Django 中获取 'popular categories'

    javascript - 导航未使用 Bootstrap ScrollSpy 更新