0

私は、json呼び出しを介してyui3データテーブルを正しく入力するように試みましたが、失敗しました。私は混乱していて、誰かが私のやり方の誤りを見せてくれることを願っています。何を試しても「表示するデータがありません」と表示されます。

ページの読み込み中にwiresharkを実行すると、ajax呼び出しから返されるjsonデータが表示されます。したがって、データソースがデータテーブルに正しくバインドされていると思います。関心のあるデータレコードがメタデータでネストされており、DataSourceJSONSchemaの定義が正しいように見えることに注意してください。

これがajax呼び出しからのhttp応答です。

YUI.Env.DataSource.callbacks.yui_3_6_0_1_1346868215546_114({
"recordsReturned":4,"startIndex":0,"dir":"asc","pageSize":10,
"records":[
  {"id":"48ee0540-ebd7-11e1-33e-c33ce39c9e", "email":"jim@example.com","name":"James"},
  {"id":"1447ea60-eca2-11e1-33e-f6c33ce39c9e", "email":"john@example.com","name":"John"},
  {"id":"48ff6a60-ebd7-11e1-a33e-f6c33ce39c9e", "email":"ryan@example.com","name":"Ryan"},
  {"id":"1a298060-f774-11e1-ad38-f6c33ce39c9e", "email":"vincent@example.com","name":"Vince"}]})

これがhtmlページです。

<script type="text/javascript">
YUI({
lang : "en-US"
})
.use("datatable","datatype","datasource",function(Y) {
var ajaxData;
function ajaxSuccess(e) {
ajaxData = e.data;
}
}
function ajaxFailure(e) {
    Y.log("failure");
}

var myDataSource = new Y.DataSource.Get({
    source : "/actions/User.action?getAjaxUserList=&"
});

myDataSource.plug(Y.Plugin.DataSourceJSONSchema,{
    schema : {
        metaFields : {
            recordsReturned : "recordsReturned",
            startIndex : "startIndex",
            dir : "dir",
            pageSize : "pageSize"
        },
        resultsListLocator : "records",
        resultFields : [ {
        key : 'id'}, {
        key : 'email'},{
        key : 'name' }}});

    var table = new Y.DataTable({
    columns : [ {
    key : "id",
    label : "ID"
    }, {
    key : "name",
    label : "Name"}, {
    key : "email",
    label : "Email"} ],
    caption : "My first DataTable!",
    summary : "Example DataTable showing basic instantiation configuration"
                                    });
    table.plug(Y.Plugin.DataTableDataSource, {datasource : myDataSource});

    table.render('#dynamicdata');
    table.datasource.load({request : encodeURIComponent('fred=steve')});
                        });
    </script>

    <div id="dynamicdata"></div>
4

1 に答える 1

2

ここで指定したコードにいくつかの構文エラーがあることに気付きました。たとえば、関数(Y)コールバックがすぐに閉じられます。

あなたのエラーは、データソースのスキーマに「resultListLocator」ではなく「resultsListLocator」プロパティを設定したことが原因だと思います。

于 2012-09-07T20:20:28.273 に答える