WEB API + ASP.NET嘗試以json格式顯示來自WEB.API的數據

我一直在試圖從我的web API中獲取信息到我的應用程序中。目前我只是試圖拉入數據還沒有提交。 API正在我的系統上作爲服務運行和運行。WEB API + ASP.NET嘗試以json格式顯示來自WEB.API的數據

它以json格式返回數據爲WEB API返回的數據示例。

[ 
    { 
    "$id": "1", 
    "id": "6c32e378-0f06-45da-9dda-0515c813cd5d", 
    "application_name": "FDB INTERFACE", 
    "description": "Interface for FDB decision support", 
    "active": true, 
    "tbl_update_header": [] 
    }, 
    { 
    "$id": "2", 
    "id": "58f68624-3803-43ff-b866-0a507ea85459", 
    "application_name": "HPM", 
    "description": "Helix Health Practice Manager", 
    "active": true, 
    "tbl_update_header": [] 
    },

這是我的網頁只是爲了嘗試，並得到了一些數據顯示

 <html> 
<head> 
    <title></title> 
    <script src="~/Scripts/jquery-2.1.1.js"></script> 
    <script type="text/javascript"> 
     $.ajax({ 
      type: "GET", 
      url: "http://localhost:9981/API/Application", 
      processData: true, 
      data: {}, 
      dataType: "json", 
      error: function (jqXHR, textStatus, errorThrown) { 
       // debug here 
       alert(jqXHR); 
      }, 
      //error: function(error, data){ 
      // console.log(error) 
      //}, 
      success: function (data) { 
       //Clear the div displaying the results 
       $("productView").empty(); 
       //Create a table and append the table body 
       var $table = $('<table border="2">'); 
       var $tbody = $table.append('<tbody />').children('tbody'); 
       //data - return value from the web api method 
       for (var i = 0; i < data.lenght; i++) { 
        //adda new row to the table 
        var $trow = $tbody.append('<tr />').children('tr:last'); 
        //add a new column to display name 
        var $tcol = $trow.append('<td/>').children('td:last').append(data[i].id); 
        //add a new column to display description 
        var $tcol = $trow.append('<td/>').children('td:last').append(data[i].description); 
       } 
       //display the table in the div 
       $table.appendTo('#productView'); 
      } 
     }); 
    </script> 

</head> 
<body> 
    <div id="productView"></div> 
</body> 
</html>

的頁面加載，但爲空，並從任何部分返回任何錯誤。我從chrome/FF/IE運行網頁他們都沒有在開發模式下顯示錯誤，VS顯示沒有錯誤。我不確定我是否解析錯誤的數據或調用json的錯誤部分來顯示數據。

在這一點上，我一定在做些傻事，但是不能讓這個部分通過。

來源

2014-05-16 yrthilian

您是否嘗試過加入'document.ready'函數內部jQuery代碼之前設置該屬性在你的js文件？ – Niklas

試過同樣的問題 – yrthilian

你也可以調用Ajax

$.support.cors = true;

來源

2014-05-20 09:20:36

上面的代碼有一個成功函數，但不是錯誤函數。

嘗試設置一個誤差函數，然後看看會發生什麼：

data: {}, 
dataType: "json", 
error: function(jqXHR, textStatus, errorThrown) { 
    // debug here 
    alert(jqXHR); 
}, 
success: function() ...

來源

2014-05-16 14:10:57 blorkfish

我得到的錯誤是[對象對象] – yrthilian

在chrome中找到了這個：Uncaught TypeError：無法讀取null的屬性'nodeName'。不知道是什麼問題 – yrthilian

所以你得到一個錯誤。設置一個調試斷點並查看Object是什麼對象。 – blorkfish

。在你的成功方法，一個錯字...

success: function (data) { 
       //Clear the div displaying the results 
       $("productView").empty(); 
       //Create a table and append the table body 
       var $table = $('<table border="2">'); 
       var $tbody = $table.append('tbody /').children('tbody'); 
       //data - return value from the web api method 
       for (var i = 0; i < data.length; i++){ 
        //adda new row to the table 
        var $trow=$tbody.append('<tr />').children('tr:last'); 
        //add a new column to display name 
        var $tcol = $trow.append('<td/>').children('td:last').append(data[i].application_name); 
        //add a new column to display description 
        var $tcol = $trow.append('<td/>').children('td:last').append(data[i].description); 
        //add a new column to display active 
        var $tcol = $trow.append('<td/>').children('td:last').append(data[i].active); 
       } 
       //display the table in the div 
       $table.appendTo('#productView');

應該data.length而不是data.lenght。

來源

2014-05-16 14:15:02 BenjaminPaul

糾正了拼寫錯誤，但仍然有相同的問題 – yrthilian

成功。這個問題與CORS有關。也與data.length 的拼寫錯誤代碼工作正常，結果是我想要的。謝謝大家的幫助。

要解決此問題，我必須在iis服務器端啓用CORS以允許跨域訪問。

來源

2014-05-17 11:37:30 yrthilian

WEB API + ASP.NET嘗試以json格式顯示來自WEB.API的數據

回答

相關問題