2012-03-04 119 views
3

我正在编写一个django web应用程序并使用jquery-ui作为用户界面。我正在使用django注册来照顾用户注册。如何使用jquery-ui和Django创建模态登录表单

基本上,我想要做的是,而不是有一个单独的登录页面,我想登录页面是一个模态对话框,以便您点击一个链接,如果你需要登录,一个弹出窗口出现,您可以从那里登录。对于这部分,我使用的是jquery-ui modal form,基本上只是显示通常隐藏的登录表单。

但是,我只能得到它的工作,如果该页面的URL看起来像这样:

url(r'^$', 
     auth_views.login, 
     {'template_name': 'index.html'}), 

因为我想在登录模式窗口中,每当用户想要做一些弹出一个需要登录,我会在多个页面上使用它。但我不想让所有的网址看起来像上面那样。

我在网站上看到了另一个问题:Django authentication and Ajax - URLs that require login 但我没有完全理解答案。我对Django和JavaScript还是比较新的,所以想知道是否有人可以提供更多的指导?

这里是 “index.html的” 窗体的一部分:

<div id="dialog-form" title="LOGIN">  
     <form method="post" action="?next={{ next|default:"/" }}"> 
     {% csrf_token %} 
     <dl> 
     <dt><label for="id_username">Username:</label>{% if form.username.errors %} <span class="error">{{ form.username.errors|join:", " }}</span>{% endif %}</dt> 
     <dd>{{ form.username }}</dd> 
     <dt><label for="id_password">Password:</label>{% if form.password.errors %} <span class="error">{{ form.password.errors|join:", " }}</span>{% endif %}</dt> 
     <dd>{{ form.password }}</dd> 
     <dt><input type="submit" value="Log in" /></dt> 
     </dl> 
     </form> 
    </div> 
    <button id="login">LOGIN</button> 

而这里的JavaScript的:

<script> 
$(function() { 

    $("#dialog-form").dialog({ 
     autoOpen: false, 
     height: 500, 
     width: 550, 
     modal: true, 
     buttons: { 
      Close: function() { 
       $(this).dialog("close"); 
      } 
     }, 
     close: function() { 
      allFields.val("").removeClass("ui-state-error"); 
     } 
    }); 

    $("#login").click(function() { 
      $("#dialog-form").dialog("open"); 
     }); 
}); 
</script> 

预先感谢您的帮助。

回答

0

这不是一个完整的答案,因为我从来没有这样做过,但是:你希望表单发送请求数据到auth_views.login - 所以你应该设置表单行动到这个地址+一些下一个数据将成功登录后重定向你。我想在django auth soruce中寻找帮助。在djangosites.org上,你可以找到带有源代码的项目,例如https://github.com/znc-sistemas/python-people - 在每个页面上都有一个登录表单的例子 - 它没有隐藏,但它并不重要。作者正在使用上下文处理器将登录表单放入每个请求上下文数据中。我相信阅读代码可以帮助你。

相关问题