WEB API + ASP.NET尝试以json格式显示来自WEB.API的数据

Question

我一直在尝试将Web API中的信息提取到应用程序中。 目前，我只是想获取尚未提交的数据。 该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的错误部分来显示数据。

在这一点上，我必须做一些愚蠢的事情，但是无法通过这部分。

Answer 1

您的成功方法有错别字...

 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 。

Answer 2

成功。 问题出在CORS。 也有data.length的拼写错误。代码可以正常工作，结果就是我想要得到的。 谢谢大家的协助。

要解决此问题，我必须在iis服务器端启用CORS，以允许跨域访问。

Answer 3

您也可以在ajax调用之前在js文件中设置此属性

$.support.cors = true;

Answer 4

上面的代码具有成功功能，但没有错误功能。

尝试设置一个错误函数，然后看看会发生什么：

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

WEB API + ASP.NET尝试以json格式显示来自WEB.API的数据

问题描述

4 个解决方案

解决方案1
1 2014-05-16 14:15:02

解决方案2
1 2014-05-17 11:37:30

解决方案3
1 已采纳 2014-05-20 09:20:36

解决方案4
0 2014-05-16 14:10:57

WEB API + ASP.NET尝试以json格式显示来自WEB.API的数据

问题描述

4 个解决方案

解决方案1 1 2014-05-16 14:15:02

解决方案2 1 2014-05-17 11:37:30

解决方案3 1 已采纳 2014-05-20 09:20:36

解决方案4 0 2014-05-16 14:10:57

解决方案1
1 2014-05-16 14:15:02

解决方案2
1 2014-05-17 11:37:30

解决方案3
1 已采纳 2014-05-20 09:20:36

解决方案4
0 2014-05-16 14:10:57