Django Ajax Jquery Call

这可能是基本的,但我花了两天时间,阅读了无数的教程,但我仍然无法使用它。 为了让它看起来有效,我试图完成一项基本任务。 我想发送一个ajax调用我的捐赠视图。 我看到它成功通过但我期待我的模板也会更新为“TRUE”但它仍然是“FALSE”。 我很欣赏任何帮助或建议。

我的jquery ……

$.ajax({ type: "POST", url:"/donate/", data: { 'test': 'success', }, success: function(){ alert('test') }, error: function(){ alert("Error"); }); 

这是我的看法……

 def donate(request): if request.is_ajax(): test = "TRUE" if request.method == 'POST': form = DonateForm(request.POST) if form.is_valid(): form.save() else: form = DonateForm() test = "FALSE" return render_to_response('donate_form.html', {'form':form,'test':test}, context_instance=RequestContext(request)) 

我的模板包括这个……

 

{{ test }}

更新/解决方案

就像在这个问题的评论中提到的那样,我没有对返回的数据做任何事情。 我将成功通话更新到以下内容并且有效

  $.ajax({ type: "POST", url:"/donate/", data: { 'zip': zip, }, success: function(data){ results = $(data).find('#results').html() $("#id_date").replaceWith("" + results + ""); }, error: function(){ alert("Error"); }, 

我认为问题在于您传递数据的位置。 你用Firebug吗? 这是一个很好的工具,用于检查您是否在POST传递任何内容,它通常是Web开发的绝佳工具。

这是从表单发送Ajax调用的工作示例

 $("#form").submit(function(event) { var $form = $(this), $inputs = $form.find("input, select, button, textarea"), serializedData = $form.serialize(); $.ajax({ url: "/donate/", type: "post", data: serializeData, success: function(response) { alert(response) } }) event.preventDefault(); }); 

然后你的视图看起来像这样

 if request.is_ajax() or request.method == 'POST': form = DonateForm(data=request.POST) if form.is_valid(): return HttpResponse("Success") else: return HttpResponse("Fail") 

顺便说一句,除非你真的需要来自$.ajax()所有额外内容,我建议你使用$.post()因为它似乎更直接使用。

我认为你的代码有些问题……

  1. 您正在向django发送POST请求而没有csrf_token => django将不会为此请求返回成功。 您需要发送带有POST请求的csrf_token。 用萤火虫检查。

  2. 即使django没有给出任何错误,你也不会在任何地方改变你的页面内容(在浏览器上)…… djang会发回这个字符串 – >“成功”……就是这样。

您需要像这样更改代码,

将’django.core.context_processors.csrf’添加到settings.py中的TEMPLATE_CONTEXT_PROCESSORS,以访问所有模板中的csrf标记。

你当前的模板:

    
{% csrf_token %} {% for field in form %} {{ field }} {% endfor %}

捐赠观点:

 def donate(request): if request.method == 'POST': form = DonateForm(data=request.POST) if form.is_valid(): form.save() return HttpResponse("SuccessFully Saved") else: return HttpResponse("Error in saving") 

现在,你会看到:

  • SuccessFully Saved – >如果成功保存了数据。
  • 保存时出错 – >如果由于某种原因未保存数据。
  • 从服务器获取错误 – >如果服务器响应有一些错误。

request.is_ajax()测试检查HTTP_X_REQUESTED_WITH标头是否存在,JQuery在发送请求之前应该设置该标头。 (如果您手动使用XMLHttpRequest,您也必须手动添加该标头。)我个人喜欢采用不同的路径,因为它更容易测试并且不依赖于HTTP标头:向URL添加查询参数,例如’?类型= AJAX”。

然后你将request.is_ajax()更改为request.GET.get('type', null) == 'ajax'并在你的JavaScript中更改url:"/donate/"url:"/donate/?type=ajax"

关于这种方法的好处是你可以在不使用AJAX的情况下测试这些调用,只需在任何请求中添加?type=ajax字符串即可。