【问题标题】:YUI Datatable - "Data Error."YUI 数据表 - “数据错误”。
【发布时间】:2011-01-02 20:44:52
【问题描述】:

我正在尝试使用带有 JSON 返回数据的 YUI 创建一个数据表。

包括json返回的数据,以及显示的页面数据。

JSON 数据:

[{"supplier_id":"127","name":"Adams Farms","description":"","ofarm":"1","active":"1"},{"supplier_id":"141","name":"Barriger Farms","description":"","ofarm":"1","active":"1"}]

YUI 的 JavaScript:

<script type="text/javascript">
YAHOO.util.Event.addListener(window, "load", function() {
    YAHOO.example.JSON = function() {
        var myColumnDefs = [
            {key:"supplier_id", label:"ID"},
            {key:"name", label:"Name"},
            {key:"description", label:"Notes"},
            {key:"ofarm", label:"Ofarm"},
            {key:"active", label:"Active"}
        ];

        var myDataSource = new YAHOO.util.DataSource("ajax/select/supplier");
        myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
        myDataSource.responseSchema = {
            fields: ["supplier_id","name","description","ofarm","active"]
        };

        var myDataTable = new YAHOO.widget.DataTable("json", myColumnDefs,
                myDataSource);

        return {
            oDS: myDataSource,
            oDT: myDataTable
        };
    }();
});
</script>

页面浏览量:

YUI 测试(标题)

此示例使用数据填充 DataTable。 (介绍文字)

ID - 名称 - 备注 - Ofarm - 活动 (列标题)

数据错误。 (返回数据)

【问题讨论】:

  • 我也有一个类似的非常简单的例子,我得到了相同的结果,有人有什么建议吗?顺便说一句,当您搜索 yui json 数据错误时,这是​​ google 上的第一个结果之一
  • @Pete Herbert Penito 见下文
  • 使用 JSARRAY 作为您的类型。应该工作。

标签: javascript yui yui-datatable


【解决方案1】:

根据 YUI dataSource 页面,YUI dataSource 需要一个 JavaScript 对象,而不是一个对象数组。并且在使用 JSON 时,必须在 responseSchema 属性上设置 resultsList。像(Notice dataSourceSettings.responseSchema.fields 属性)

(function() {
    var YdataTable  = YAHOO.widget.DataTable,
        YdataSource = YAHOO.util.DataSource;

    var settings = {
        container:"<DATATABLE_CONTAINER_GOES_HERE>",
        source:"<URL_TO_RETRIEVE_YOUR_DATA>",
        columnSettings:[
            {key:"supplier_id", label:"ID"},
            {key:"name", label:"Name"},
            {key:"description", label:"Notes"},
            {key:"ofarm", label:"Ofarm"},
            {key:"active", label:"Active"}
        ],
        dataSourceSettings:{
            responseType:YdataSource.TYPE_JSON,
            responseSchema:{
                resultsList:"<DOT_NOTATION_LOCATION_TO_RESULTS>",
                fields:[
                    {key:"supplier_id"},
                    {key:"name"},
                    {key:"description"},
                    {key:"ofarm"},
                    {key:"active"}
                ]
            }
        },
        dataTableSettings:{
            initialLoad:false
        }
    }

    var dataTable = new YdataTable(
                    settings.container, 
                    settings.columnSettings, 
                    new YdataSource(
                    settings.source, 
                    settings.dataSourceSettings), 
                    settings.dataTableSettings);
})();

【讨论】:

  • 这是一个巨大的帮助,我将 ResultSet 和 Result 放入我的 JSON 中,它工作了,谢谢!
  • 解决方案的解决方法是使用“responseType:YdataSource.TYPE_JSARRAY”。但是,是的,这也可以。
【解决方案2】:

附带说明一下,我在查找 YUI 数据表中“数据错误”的原因时发现了这个页面,最终我发现我缺少 /build/connection/connection-min.js 脚本参考我的网页。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2010-12-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2010-11-29
    • 1970-01-01
    相关资源
    最近更新 更多