ページ内でデータを作成して行う処理
ページ内で動的にデータを作成したいときは、Y.DataSource.Function()
を使用し、source:でデータ作成処理を書きます。実行時に動的に出力データを変更したいときなどに使用します。データを関数のreturnで戻すようにした例題を示します。リスト6をみてください。
YUI().use("dump", "node", "datasource", function (Y) { var myDataSource = new Y.DataSource.Function({ source:function(request){ return { "Student":[ {"id":111,"name":"赤坂","sei":"男性"}, {"id":222,"name":"池田","sei":"女性"}, {"id":333,"name":"上野","sei":"男性"}, {"id":444,"name":"岡田","sei":"女性"} ] }; }}); //(1) myDataSource.plug(Y.Plugin.DataSourceJSONSchema, { schema: { resultListLocator: "Student", resultFields: ["sei","name","id"] } }); //(2) var myCallback = { success: function(e){ alert(Y.dump(e.response.results[1].name)); }, failure: function(e){ alert("Could not retrieve data: " + e.error.message); } }; //(3) Y.one('#button').on("click", function(e) { myDataSource.sendRequest(null, myCallback); }); //(4) }); </script> </head> <body> JSONデータ処理 Function<br><br> <input type="button" id="button" value="Push!!"> </body>
(2)は読み込み指定、(3)はコールバック関数、(4)は表示指定です。(1)にY.DataSource.Function
を指定します。source:の、function()でデータを戻しています。