javascript - YUI 数据表数据源是否适用于所有有效的 JSON 对象？

Question

首先，我应该指出我使用 http://jsonlint.com 验证了我的 JSON 对象这确实是有效的。

现在这已经不再是问题了，我正在查看 YUI DataTable 的示例，特别是示例使用的数据源和 JSON 对象的结构(请参阅 http://developer.yahoo.com/yui/examples/datatable/dt_basic.html )。

基本示例使用如下组成的数据源:

YAHOO.example.Data = {
  bookorders: [
    {id:"po-0167", date:new Date(1980, 2, 24), quantity:1, amount:4, title:"A Book About Nothing"},
    {id:"po-0783", date:new Date("January 3, 1983"), quantity:null, amount:12.12345, title:"The Meaning of Life"},
    {id:"po-0297", date:new Date(1978, 11, 12), quantity:12, amount:1.25, title:"This Book Was Meant to Be Read Aloud"},
    {id:"po-1482", date:new Date("March 11, 1985"), quantity:6, amount:3.5, title:"Read Me Twice"}
  ]
}

而我的 JSON 对象如下所示:

[
  {
    "Listing": {
        "Name": "Jay",
        "Address": "Main Street",
        "City": "New York"
    }
  },
  {
    "Listing": {
        "Name": "Thomas",
        "Address": "Union Street",
        "City": "New York"
    }
  },
  {
    "Listing": {
        "Name": "Jason",
        "Address": "Square Street",
        "City": "Boston"
    }
  }
]

以下是雅虎的示例如何指定数据源以及与之相关的其他几行:

var myDataSource = new YAHOO.util.DataSource(YAHOO.example.Data.bookorders);
myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY;
myDataSource.responseSchema = {
  fields: ["id","date","quantity","amount","title"]
};

在我的 JSON 对象中，每个“列表”都是 YUI 数据表中的一行。我需要在 YUI 代码中修改哪些内容才能使其与我的 JSON 对象一起使用？

谢谢。

Answer 1

上面你定义了一个对象，有一个未命名的对象数组，每个对象都由另一个带有成员的对象组成。虽然这可能是有效的 JSON，但我认为这与 YUI 数据表的期望不兼容。这更像是一个人为的或令人困惑的挑战。

我无法提供一种使用现有 JSON 对象的方法。虽然您的 JSON 有效，但恕我直言，我不认为它与 YUI 数据表兼容。

我认为您需要一个包含具有成员的命名对象数组的对象，而不是其他对象。现有数据结构中有太多层，对我来说没有明显的用途。

下面的“更改”意味着更改 YAHOO 提供的基本数据表示例。

像这样简单地重组你的数据，

YAHOO.example.Data = {
  Listing: [
    {
          "Name": "Jay",
          "Address": "Main Street",
          "City": "New York"
    },
    {
          "Name": "Thomas",
          "Address": "Union Street",
          "City": "New York"
    },
    {
          "Name": "Jason",
          "Address": "Square Street",
          "City": "Boston"
    }
  ]
};

将简化您的数据结构并使之有效。我认为，考虑到这些限制，这是最小的改变。

然后更改数据源:

var myDataSource = new YAHOO.util.DataSource(YAHOO.example.Data.Listing);

和列定义

var myColumnDefs = [
      {key:"Name"},
      {key:"Address"},
      {key:"City"}
];

最后是响应模式

myDataSource.responseSchema = {
    fields: ["Name","Address","City"]
};

希望有帮助。