JQueryUI数据表集合绑定问题

我试图找出如何将来自AJAX调用的集合绑定到DataTable，但失败了，但遗憾的是，每次我都会收到一个错误，说JSON无效（但不是！）

我有一个名为“response”的返回对象，它有一个名为“Recipients”的集合，该集合有一个类型为“Recipient”的对象，并且有一些道具：

名字 姓氏 电子邮件地址

i、 e:回复，收件人 将其转换为客户端调用中的data.Recipients（参见下文）

我不知道如何让它绑定-有什么想法吗

这是我当前的代码：

$.ajax({
                contentType: 'application/json',
                url: '@Url.Action("GetRecipients")',
                type: 'POST',
                dataType: 'json',
                data: jsonPayload,
                cache: false,
                success: function (data) {
                    if (data.Success) {
                        $('#tblRecipients').DataTable({
                            "data": data.Recipients,
                            "columns": [{
                                "Firstname": "Firstname",
                                "Lastname": "Lastname",
                                "EmailAddress": "EmailAddress"
                            }]
                        });
                    }
                    else {
                        alert(data.FailureInformation);
                    }
                },
                error: function (xhr, status, error) {
                    alert('There was a problem obtaining the selected recipient details. Please try again later');
                }
            });

肯定不会这么难吧

是的，数据是正确的。我可以在Recipients对象中看到3个从呼叫返回的项目

谢谢你的指点

编辑-示例json：

[{
  "Firstname": "Tim",
  "Lastname": "Hughes",
  "EmailAddress": "th@test.com"
}, {
  "Firstname": "Joe",
  "Lastname": "Bloggs",
  "EmailAddress": "jb@test.com"
}]

---

应该使用aoColumns而不是columns

让我们考虑下面的例子

 var test = [ {"Firstname":"Tim","Lastname":"Hughes","EmailAddress":"th@test.com"},{"Firstname":"Joe","Lastname":"Bloggs","EmailAddress":"jb@test.com"} ];
                    $('#tblRecipients').DataTable({
                        "aaData": test,
                        "aoColumns": [
    { "mDataProp": "Firstname" },
    { "mDataProp": "Lastname" },
    { "mDataProp": "EmailAddress" }
]
                    });

我还创建了JS fiddle，请查看更改

$('#tblRecipients').DataTable({
                        "data": data.Recipients,
                        "columns": [{
                            "Firstname": "Firstname",
                            "Lastname": "Lastname",
                            "EmailAddress": "EmailAddress"
                        }]
                    });

为此：

$('#tblRecipients').DataTable({
                        data: data.Recipients,
                        columns: [{
                            "Firstname": "Firstname",
                            "Lastname": "Lastname",
                            "EmailAddress": "EmailAddress"
                        }]
                    });

---

我不知道为什么，但是使用

数据

和

列

代替字符串属性名在@mauliksakhare的JSFIDLE中也很有效。

好的。没人知道。我相信OP想要一个答案。如果在中使用

”

，则问题显然不存在

"columns": [{
   "Firstname": "Firstname",
   "Lastname": "Lastname",
   "EmailAddress": "EmailAddress"
}]

但是您应该在

列中定义
数据
，这是正确的

columns: [
    {  data: "Firstname" },
    {  data: "Lastname" },
    {  data: "EmailAddress" }
 ]

请参见演示->
您可以发布一个JSON示例吗？我认为发布它将使人们更容易发现这里的问题是什么当然-只是发布它！根据我下面的回答，尝试使用带引号和不带引号的属性名称。我觉得JavaScript和它无尽的库在处理这两种情况时是非常不一致的。用
data
替换
“aaData”
和
“aoColumns”
替换
columns
。到底有什么区别呢？@davidkonrad击败了我，但它确实有效。我每次调用
DataTable（）
时都使用这个约定。没有区别。如果
xxx:
起作用
“xxx”：
也起作用，反之亦然。为什么它应该在嵌套对象文本中工作，而不是在父对象中工作？哇。这几乎奏效了！谢谢David:）-似乎只填充表中的电子邮件地址？我确实看到了firstname，lastname数据返回…@Ahmedilyas，请参见编辑-忘记逐项列出列。现在可以了，谢谢。这确实奏效了！非常感谢。