在MVC应用程序中通过DataTables.NET Ajax调用访问WebAPI 2 json [英] Accessing WebAPI 2 json with DataTables.NET ajax call in MVC application

问题描述

我一直在尝试使DataTables.NET与我构建的WebAPI RESTFul服务很好地配合，并且返回的json似乎不适合DataTables所寻找的内容.我尝试了各种服务器处理"示例以及在互联网上找到的一些示例，例如

I have been trying to get DataTables.NET to play nicely with a WebAPI RESTFul service I built and the json being returned does not seem to fit what DataTables is looking for. I have tried the various "server processing" examples along with a few examples I found on the internet like this one, but I don't want to make the WebAPI call dynamic. I want the API to be self documenting so that other applications and other developers can easily also use the API. So far, here is what I have.

从我的API返回Json.stringify后的JSON数组是这样的:

The JSON array after doing a Json.stringify being returned from my API is this:

[{"FirstName":"Gregg","LastName":"Coleman"},{"FirstName":"Ryan","LastName":"May"},{"FirstName":"Sean","LastName":"OConnor"},{"FirstName":"Rebecca","LastName":"Coleman"}]

datatable.net代码如下:

The datatable.net code looks like this:

$("#data-table").DataTable({

            serverSide: true,
            processing: true,
            ajax: {

                url: "http://localhost:55180/api/Person",
                type: 'GET',
                dataType: 'json',
                dataSrc: function(json)
                {
                    var j = JSON.stringify(json)
                    alert(j);
                    return j;
                }
            }

        });

HTML看起来像这样

And the HTML looks like this

<table id="data-table" class="display">
<thead>
    <tr>
        <th>First Name</th>
        <th>Last Name</th>
    </tr>
</thead>

我从dataTables中获得的错误是:

The error I am getting back from dataTables is:

"DataTables警告:表id = data-table-为第0行第1列请求未知参数'1'.有关此错误的更多信息，请参见

"DataTables warning: table id=data-table - Request unknown parameter '1' for row 0, column 1. For more information about this error, please see http://datatables.net/tn/4.

任何帮助将不胜感激

推荐答案

您需要指定JSON中与哪些列相对应的属性.另外，您还需要将 dataSrc 设置为''(因为dataTables期望包含JSON项的数组被命名为 data )或仅返回JSON在 dataSrc 回调中.只需将 dataSrc 设置为''似乎是最简单的:

You need to specify which attributes in the JSON that correspond to which columns. Also you need to set dataSrc to '' (because dataTables expects that the array holding the JSON items is named data) or simply return the JSON in the dataSrc callback. Just setting the dataSrc to '' seems to be the easiest :

$("#data-table").DataTable({
      serverSide: true,
      processing: true,
      columns : [
          { data : 'FirstName' },
          { data : 'LastName' }
      ],    
      ajax: {
          url: "http://localhost:55180/api/Person",
          dataSrc : ''
      }
});  

现在dataTable已正确初始化-> http://jsfiddle.net/2jgt3mn8/

now the dataTable is initialized properly -> http://jsfiddle.net/2jgt3mn8/

这篇关于在MVC应用程序中通过DataTables.NET Ajax调用访问WebAPI 2 json的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！