Question

我只是想解析json数据并使用Alloy UI的框架将其显示在数据表中

YUI().use(
    'aui-datatable', 'json-parse', 
    function(Y) {
        var columns = [
            { key: 'ID', sortable: true },
            { key: 'Name', sortable: true }
        ];
        var jsonstring = '{"info":['+
                     '{"ID":"100", "Name":"Roy"},'+
                     '{"ID":"200", "Name":"Moss"},'+
                     '{"ID":"300", "Name":"Jen"}'+
        ']}';
        try {
           data = Y.JSON.parse(jsonstring);
        }
        catch (e) {
            alert("Invalid data");
        }
        new Y.DataTable(
            {
                columns: columns,
                data: data
            }
        ).render("#mySearchResultsContainer");
    }

1）如何将ID和Name映射到数据表中的列？

2）如何使用外部json文件中的数据实现这一目标？

Answer 1

在这里：http://jsfiddle.net/9wd8jqtL/

主要问题是你传递给DataTable的数据需要是一个数组：你传递的是对象。传入data.info为它提供了你想要的数组：

 new Y.DataTable(
        {
            columns: columns,
            data: data.info
        }
    ).render("#mySearchResultsContainer");

另外，我认为你需要以这种或那种方式包含Alloy UI数据表脚本。我当然在jsfiddle上做了它以使它工作（我也认为在jsfiddle上也可能存在更新版本的YUI的问题），但这不应该是其他地方的问题。

在获取外部数据时，它取决于它的来源。但很可能你需要Y.io或类似的东西来加载数据，并在数据返回的回调中使用你的表构建函数。

使用Alloy UI显示JSON数据

1 个答案: