2013-05-29 38 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