2013-05-29 57 views
7

基本上我需要類似於在django中完成的http://www.w3schools.com/jquery/jquery_ajax_get_post.asp。我已經下載了樣本並使用localhost + php在本地進行了測試,並且運行良好,但似乎無法讓它在django中運行,無論此示例如何簡單。這裏的基本上是我根據上面的例子一樣從上面的鏈接稍加修改需要一個簡單的工作ajax例如Django的形式

的JavaScript:

<script type="text/javascript"> 
$(document).ready(function(){ 
    $("#my_form").submit(function(){ 
    $.post("", 
    {name:"Donald Duck", 
    city:"Duckburg"}, 
    function(data,status){ 
     alert("Data: " + data + "\nStatus: " + status); 
    }) 
    .fail(function() { alert("error"); }); 
    return false; 
    }); 
}); 
</script> 

網址:

url(r'^ajax/$', views.ajax_test, name="ajax"), 

的看法:

def ajax_test(request): 
    if request.method == 'POST' and request.is_ajax(): 
     name = request.POST['name'] 
     city = request.POST['city'] 
     message = name + ' lives in ' + city 

     return HttpResponse(json.dumps({'message': message})) #tried without the json. Doesn't work either 

    return render(request, 'books/ajaxTest.html') 

html:

<form id="my_form" action="" method="post" {% if form.is_multipart %}enctype="multipart/form-data"{% endif %}>{% csrf_token %} 
<input type="submit" value="Send"> 
</form> 

表單假設包含一個django表單,但由於我甚至無法獲得基本的工作,這將是有點沒有意義。有人提到了csrf_token標籤,但刪除也不能解決問題。上面例子的輸出基本上只產生警報('錯誤'),沒有別的。我已經通過了這麼多的例子,但我甚至不能得到最基本的工作

+0

如果喲您在Chrome Inspector或Firefox Firebug中檢查您的Ajax響應,您應該看到一些錯誤消息,這應該引導您瞭解如何解決該問題。 –

+1

我寫了一篇關於在Django中使用JQuery實現Ajax的教程:https://aliteralmind.wordpress.com/2014/09/21/jquery_django_tutorial/ – aliteralmind

回答

8

行..好了..thx爲您的意見..我把它都清理出來..基本上我錯過了{ %csrf_token%}和csrfmiddlewaretoken: '{{csrf_token}}' ..只是誰可能是閱讀this..the新代碼將是這個樣子

的JavaScript者的利益:

<script type="text/javascript"> 
$(document).ready(function(){ 

    $("#my_form").submit(function(){ 
    $.post("", 
    {name:"Donald Duck", 
    city:"Duckburg", 
    csrfmiddlewaretoken:'{{ csrf_token }}' 
    }, 
    function(data,status){ 
     alert("Data: " + data + "\nStatus: " + status); 
    }) 
    .fail(function(xhr) { 
     console.log("Error: " + xhr.statusText); 
     alert("Error: " + xhr.statusText); 
    }); 
    return false; 
    }); 

}); 
</script> 

的HTML:

<form id="my_form" action="" method="post">{% csrf_token %} 
<input type="submit" value="Send"> 
</form> 
+1

不錯。感謝張貼。 – Paul