Ajaxを使用したDjango POST

Question

私は1つのアプリケーション名register_loginを持っており、このアプリケーションはloginとopeartionsを管理しています。私はlocalhost：8000/loginページにフォームを持っています。私はボタンがregister_loginアプリで自分のfuncにリダイレクトされたいと思っていますが、私はそれをやりません。私はDjango Frameworkの新機能です。どのように私はこれを処理できますか？

MAIN URLS.PY

from django.conf.urls import include,url 
from django.contrib import admin 
from register_login.views import login, register, test 


urlpatterns = [ 
    url(r'^admin/', admin.site.urls), 
    url(r'^homepage/', include('homepage.urls')), 
    url(r'^login/$', login), 
    url(r'^register/$', register), 
    url(r'^success/$', test), 
] 

ログインページ.HTML

<form id=registerLogin style="margin-top: 30px; margin-left: 350px;"> 
     <header>Login</header> 
     <label >Username <span>*</span></label> 
     <input id="username"/> 
     <label >Password <span>*</span></label> 
     <input id="password"/> 
     <button id="login">Login</button> 
     <h1 style="margin-left: 20px;">Are you not registered?</h1> 
     <button id="register">Register</button> 
</form> 

このHTMLの終わりに私の.jsファイルがあります。私は忘れていませんでした。

JAVASCRIPT

if (!jQuery) { throw new Error("This page requires jQuery") } 


function readInput() { 
    e.preventDefault(); 
    var userName = document.getElementById('username').value; 
    var password = document.getElementById('password').value; 
    debugger 

    $.ajax({ 
     type: "POST", 
     url: "/success/", 
     data: {'username':username,'password':password, csrfmiddlewaretoken: '{{ csrf_token }}'}, 
     dataType: 'json', 
     success : function(json) { 
      $('#post-text').val(''); // remove the value from the input 
      console.log(json); // log the returned json to the console 
      console.log("success"); // another sanity check 
     },  
    }); 
} 

(function ($) { 

$("#login").click(function(){ 
    readInput(); 
}); 


})(jQuery); 

そして最後に、私の機能。そのregister_loginアプリで私は、 "/ register_login /成功/ $" "/ register_login /成功/"、 "/ register_login /成功" のようなURLを変更しようとしました

REGISTER_LOGINのVIEW

def test(request): 
    embed() 
    if request.method == 'POST': 
     embed() 
    return HttpResponse("hell world") 

前に言ったように、 "/ success /"、 "success /"、 "/ success/$"のいずれかである。何も私はその機能を移動する必要がありますが、それはdoesntの:(

Answer 1

をあなたは、AJAX経由でログインしているので

に動作しない、あなたは何ができるか。あなたのtestビューにリダイレクトすることはできませんあなたのAjaxの成功にリダイレクトを追加することです機能このような何か：。

// similar behavior as an HTTP redirect 
window.location.replace("/some-url/"); 

または

// similar behavior as clicking on a link 
window.location.href = "/some-url/"; 

また、あなたはあなたのjavascriptのコードを修正する必要があり、クリックhandl中でpreventDefaultを追加それをreadInputで削除します。また、データオブジェクトの引用符を削除し、正しい変数を使用していることを確認する必要があります。このようなもの：

$(function() { 
    function readInput() { 
     var username = document.getElementById('username').value; 
     var password = document.getElementById('password').value; 

     $.ajax({ 
      type: "POST", 
      url: "/success/", 
      data: { 
       username: username, 
       password: password, 
       csrfmiddlewaretoken: '{{ csrf_token }}' 
      }, 
      dataType: 'json', 
      success : function(json) { 
       window.location.replace("/some-url/"); 
      } 
     }); 
    } 

    $("#login").click(function(e){ 
     e.preventDefault(); 
     readInput(); 
    }); 
});