無法讓jquery查看從Django視圖返回的JSON對象

我有一個允許用戶更改數據庫中的帳戶信息的表單。提交時，表單調用Django視圖，並提交給隱藏的iframe。該視圖返回一個JSON對象。無法讓jquery查看從Django視圖返回的JSON對象

隱藏的iframe可以看到這個對象。在Chrome瀏覽器中，我可以看到我期望寫入iframe的字段。

jQuery嘗試訪問這些數據時遇到了麻煩。 jQuery函數從不運行。控制檯日誌和警報從不觸發。我需要能夠從django視圖返回的數據觸發該函數。

這是我的模板文件中的jQuery塊。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js'>  
$('#hiframe').ready(function(){ 
    $.getJSON('{{url_root}}/userupdate/update/', function(data) { 
     var parseddata = $.parseJSON(data); 
     console.log(parseddata); 
     alert(parseddata.UserId); 
    });        
}); 
</script>

這裏是iframe和模板的形式：

<iframe name='hiddeniframe' id='hiframe' scrolling='no' frameborder='0' style='display:none'></iframe> 

<form id="userUpdate" name="userUpdate" action="{{url_root}}/userupdate/update/" method="POST" target='hiddeniframe'>

最後，這是我從我的觀點函數返回的字典：

json_data = {'UserId': user_name, 
      'FirstName': user_fname, 
      'LastName': user_lname, 
      'Status': user_status} 

return HttpResponse(json.dumps(json_data), content_type='application/json')

編輯發佈解決方案：

knbk給了我一些很好的建議，我可以使用它們來完成這項工作。我刪除了HTML表單，並使用下面的代碼從視圖中發送和接收。

添加我的解決方案，以防其他人遇到同樣的問題。

  $.ajax({ 
       url: "{{url_root}}/userupdate/update/", 
       type: 'POST', 
       dataType: 'json', 
       data: data, 
       success: function(dta){ 
        jsonfromDB = dta[0]; 

        if (jsonfromDB['ErrMsg'].length > 0) { 
         alert(jsonfromDB['ErrMsg'].join("\n")); 
        } 

        // This is true when we have updated the database. 
        if(jsonfromDB['UpdateStatus']) { 

         // Grab the User input 
         fname.val(jsonfromDB['FirstName']); 
         lname.val(jsonfromDB['LastName']); 
         stat.val(jsonfromDB['Status']); 

         // We want the user to know when success has happened. 
         alert('Your database update was sucessful.'); 
        } 
       }, 
       error: function(errdata){ 
        jfDB = errdata[0]; 
        if (jfDB['ErrMsg'].length > 0) { 
         alert(jfDB['ErrMsg'].join("\n")); 
        } 
       } 
      });

來源

2013-07-29 yubus

您的代碼存在一些問題。

首先，您的一個script標記中包含一個具有src屬性的JavaScript代碼。如果您在html文件中包含javascript代碼，請使用單獨的script標記，而不要使用src屬性。這就是爲什麼你的代碼沒有被執行，爲什麼你沒有看到控制檯中的任何東西。

如果您解決了這個問題，並且您的表單中的代碼與我認爲的相同（使用沒有指定onclick或任何內容的提交按鈕），則首先使用正確的數據向服務器發送POST請求，然後，當請求完成並且JSON作爲原始文本加載到您的iframe中時，您將發送另一個JSON請求到相同的url，這次是通過GET請求，而不包含任何數據，並且不知何故期望獲得與您相同的響應進入你的iframe。

此外，使用`{％url'view_name'％}標記通常比將硬編碼到您的模板中更好。

你應該怎麼做，是有一個button或submit輸入與附加的onClick函數。如果您使用的是submit按鈕，則需要prevent the default action，並且連接到您的action url的視圖應處理默認表單提交。您的JSON方法應該使用不同的url/django視圖來返回JSON數據。

這個onclick函數應該從窗體收集數據，並使用AJAX請求將其發佈到服務器。在您更新服務器上的數據時，HTML標準建議使用POST請求。爲此，您需要使用$.ajax()而不是$.getJSON()。

JavaScript代碼應該看起來有點像這樣：

<script type="text/javascript"> 
$('#<submitbutton_id').onclick(function(event) { 
    data = { 
    UserId: $('#userid_field_id').val(), 
    etc. 
    } 
    $.ajax("{% url 'update_user_ajax' %}", 
    { type: 'POST', 
    dataType: 'json', 
    data: data, 
    success: function(data) { 
     <parse the data> 
    } 
    event.preventDefault() 
}) 
</script>

來源

2013-07-29 23:19:20 knbk

謝謝你的回覆。我不是新手編程，但我是網絡編程新手。一位同事也指出了同樣的

我不確定隱藏的iframe是什麼點。你也沒有說明實際問題是什麼。

但是，看起來您的jQuery代碼不在<script>...</script>標籤內，這可能是問題所在。

來源

2013-07-29 18:46:31

對不起。讓我編輯它。隱藏的iframe是因爲我有幾種形式（每個用戶一個），我想用更改的內容更新頁面。我提交給隱藏的iframe，然後使用jQuery來更新已更改的行。我試圖將問題歸結爲最基本的問題。 – yubus

我還添加了更多的解釋，我需要幫助搞清楚。 – yubus

相關問題

無法讓jquery查看從Django視圖返回的JSON對象

回答

相關問題