如何使用jQuery將數據發送到Django視圖並呈現Django模板？

我有一些JavaScript數據，並希望將其發送到Django視圖函數。之後，我想使用HttpResponse呈現Django模板，但它是如何工作的？如何使用jQuery將數據發送到Django視圖並呈現Django模板？

首先，我用jQuery.ajax（）發送了一些數據到Django視圖，並使用了響應數據，現在我想在第二個jQuery.ajax（）中發送數據 - 點擊按鈕後 - Django查看功能，並最終呈現一個簡單的模板，就像它是如何工作的，如果我點擊網站上的簡單鏈接。

我已經儘可能地削減片段爲清楚起見

$(matchfield).on('click', function(event) { 
    event.preventDefault(); 
    var field = $(this).val(); 
    $.ajax({ 
     method: "POST", 
     url: "/view-function/", 
     data: { "field": field }, 
     dataType: "json", 
     context: this, 
     success: function (data) { 
      if(data.message === 1) { 
       points = 100 
       $('#submit').on('click', function(event) { 
        event.preventDefault(); 
        $.ajax({ 
         url: "/another-view/", 
         method: "POST", 
         data: {"points": points}, 
         success:function(response){ // I guess the mistake is here 
          $(document).html(response) 
         } 
        }) 
       }) 
      } 
     } 
    }); 
});

如果被點擊的#submit按鈕，響應的狀態代碼是200和Chrome開發工具顯示了完整的預期預覽中的新HTML頁面（無CSS樣式），但在當前頁面上沒有任何反應。

這是響應：

<!DOCTYPE html> 
<html> 
    <head> 
     // head stuff 
    </head> 
    <body> 
     // Some stuff 
    </body> 
</html>

我用return HttpResponse(template.render(context, request))

我查看-功能：

from django.http import HttpResponse 

def another-view(request): 
    if request.method == "POST": 
     if request.POST.get("points"): 
      points = int(request.POST.get("points")) 
      template = loader.get_template('my_template.html') 
      context = {'message': "any message"} 
      return HttpResponse(template.render(context, request))

這是我的看法功能是如何工作的，點存儲在數據庫和一些魔術發生，但一切正常，請求狀態代碼是200.

我不幸不知道我忽略了什麼。

來自AJAX（內部ajax（）與url：「/ another-view /」）的響應是預期的HTML頁面，但在當前頁面上沒有發生。我想替換整個頁面

來源

2017-10-06 MK87

向我們展示了Python代碼用於查看功能。 –

你能展示你的觀點嗎？從你目前的問題來看，你似乎並不真的需要ajax。 – Sam

好吧，快速瀏覽一下，你正在檢查'points' AJAX查詢運行的時間，而不是'field'。你有'如果request.POST.get（「field」）：'在任何地方？（對不起，提前點擊提交） – Sam

我找到了解決方案。重定向到與POST數據Django視圖功能，您可以使用jQuery.redirect功能，可用後包括https://github.com/mgalante/jquery.redirect的jquery.redirect.js

用法：

/** 
* jQuery Redirect 
* @param {string} url - Url of the redirection 
* @param {Object} values - (optional) An object with the data to send. If not present will look for values as QueryString in the target url. 
* @param {string} method - (optional) The HTTP verb can be GET or POST (defaults to POST) 
* @param {string} target - (optional) The target of the form. If you set "_blank" will open the url in a new window. 
* @param {boolean} traditional - (optional) This provides the same function as jquery's ajax function. The brackets are omitted on the field name if its an array. This allows arrays to work with MVC.net among others. 
* @param {boolean} redirectTop - (optional) If its called from a iframe, force to navigate the top window. 
*/ 
$.redirect(url, [values, [method, [target, [traditional, [redirectTop]]]]])

來源

2017-10-07 22:12:13 MK87

如何使用jQuery將數據發送到Django視圖並呈現Django模板？

回答

相關問題