2012-03-04 74 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 - 在每個頁面上都有一個登錄表單的例子 - 它沒有隱藏,但它並不重要。作者正在使用上下文處理器將登錄表單放入每個請求上下文數據中。我相信閱讀代碼可以幫助你。

相關問題