5
<title>Example: DataSchema.XML for XML Data</title>
6
<link rel="stylesheet" href="http://yui.yahooapis.com/3.4.0pr3/build/cssgrids/grids-min.css">
7
<link rel="stylesheet" href="../assets/css/main.css">
8
<link rel="stylesheet" href="../assets/vendor/prettify/prettify-min.css">
9
<script src="../../build/yui/yui-min.js"></script>
14
<h1>Example: DataSchema.XML for XML Data</h1>
19
<div id="main" class="yui3-u">
20
<div class="content"><div class="intro">
21
<p>DataSchema.XML normalizes arbitrary XML data against a given schema into an object with known properties.</p>
23
<p><strong>Note:</strong> XML parsing currently has known issues on the Android WebKit browser.</p>
26
<div class="example yui3-skin-sam">
28
/* custom styles for this example */
29
#demo .output {margin-bottom:1em; padding:10px; border:1px solid #D9D9D9;}
33
<h4>Basic example</h4>
37
<session>34637542</session>
38
<category name="music" id="5"><results>
39
<song id="59672468">
40
<title>I Kissed A Girl</title>
41
<rank>1</rank>
42
<artist id="30326214">Katy Perry</artist>
44
<song id="47973564">
45
<title>Shake It</title>
46
<rank>2</rank>
47
<artist id="45575683">Metro Station</artist>
49
<song id="52207363">
50
<title>Bleeding Love</title>
51
<rank>3</rank>
52
<artist id="37956508">Leona Lewis</artist>
54
</results></category>
61
resultListLocator: "song",
62
resultFields: [{key:"title"}, {key:"artist"}, {key:"rank"}]
66
<h6>Normalized data</h6>
67
<input type="button" id="demo_apply_basic" value="Apply schema =>">
68
<div id="demo_output_basic" class="output"></div>
70
<h4>Complex example</h4>
74
<Session>542235629</Session>
75
<Tracks start="1" count="10" total="98" errorCount="0"
76
defaultSort="popularity+" description="Top 100 Tracks"
77
name="Top 100 Tracks">
78
<Track id="59672468" rating="-1" title="I Kissed A Girl">
79
<Artist id="30326214" rating="-1">Katy Perry</Artist>
80
<ItemInfo><ChartPosition last="26" this="1"/></ItemInfo>
82
<Track id="47973564" rating="-1" title="Shake It">
83
<Artist id="45575683" rating="-1">Metro Station</Artist>
84
<ItemInfo><ChartPosition last="27" this="2"/></ItemInfo>
86
<Track id="52207363" rating="-1" title="Bleeding Love">
87
<Artist id="37956508" rating="-1">Leona Lewis</Artist>
88
<ItemInfo><ChartPosition last="28" this="3"/></ItemInfo>
97
metaFields: {session:"//Session", total:"//Tracks/@total"},
98
resultListLocator: "//Track",
99
resultFields: [{key:"song", locator:"@title"},
100
{key:"artist", locator:"Artist"},
101
{key:"rank", locator:"ItemInfo/ChartPosition/@this"}]
105
<h6>Normalized data</h6>
106
<input type="button" id="demo_apply_complex" value="Apply schema =>">
107
<div id="demo_output_complex" class="output"></div>
109
<h4>Nested example</h4>
113
<dessert type="treat">
114
<name>cupcake</name>
116
<flavor name="chocolate"/>
117
<flavor name="red velvet"/>
120
<dessert type="treat">
121
<name>ice cream</name>
123
<flavor name="chocolate"/>
124
<flavor name="strawberry"/>
125
<flavor name="vanilla"/>
128
<dessert type="treat">
129
<name>pie</name>
131
<flavor name="banana cream"/>
132
<flavor name="blueberry"/>
133
<flavor name="cherry"/>
136
<dessert type="beverage">
137
<name>hot chocolate</name>>
139
<dessert type="beverage">
140
<name>port wine</name>
148
resultListLocator: "dessert",
150
{key:"type", locator:"@type"},
151
{key:"name", locator:"name"},
152
{key:"flavors", schema: {
153
resultListLocator: "flavor",
155
{key:"flavor", locator:"@name"}
162
<h6>Normalized data</h6>
163
<input type="button" id="demo_apply_nested" value="Apply schema =>">
164
<div id="demo_output_nested" class="output"></div>
169
YUI().use("dump", "node", "datatype-xml", "dataschema-xml", function (Y) {
170
Y.on("click", function(e){
171
var data_in = Y.DataType.XML.parse('<root><session>34637542</session><category name="music" id="5"><results><song id="59672468"><title>I Kissed A Girl</title><rank>1</rank><artist id="30326214">Katy Perry</artist></song><song id="47973564"><title>Shake It</title><rank>2</rank><artist id="45575683">Metro Station</artist></song><song id="52207363"><title>Bleeding Love</title><rank>3</rank><artist id="37956508">Leona Lewis</artist></song></results></category></root>'),
173
resultListLocator: "song",
174
resultFields: [{key:"title"}, {key:"artist"}, {key:"rank"}] // Or simply ["title", "artist", "rank"]
176
Y.one("#demo_output_basic").setContent(Y.dump(Y.DataSchema.XML.apply(schema, data_in)));
177
}, "#demo_apply_basic");
180
Y.on("click", function(e){
181
var data_in = Y.DataType.XML.parse('<Response><Session>542235629</Session><Tracks start="1" count="10" total="98" errorCount="0" defaultSort="popularity+" description="Top 100 Tracks" name="Top 100 Tracks" ><Track id="59672468" rating="-1" title="I Kissed A Girl"><Artist id="30326214" rating="-1">Katy Perry</Artist><ItemInfo><ChartPosition last="26" this="1"/></ItemInfo></Track><Track id="47973564" rating="-1" title="Shake It"><Artist id="45575683" rating="-1">Metro Station</Artist><ItemInfo><ChartPosition last="27" this="2"/></ItemInfo></Track><Track id="52207363" rating="-1" title="Bleeding Love"><Artist id="37956508" rating="-1">Leona Lewis</Artist><ItemInfo><ChartPosition last="28" this="3"/></ItemInfo></Track></Tracks></Response>'),
183
metaFields: {session:"//Session", total:"//Tracks/@total"},
184
resultListLocator: "//Track",
185
resultFields: [{key:"song", locator:"@title"}, {key:"artist", locator:"Artist"}, {key:"rank", locator:"ItemInfo/ChartPosition/@this"}]
187
Y.one("#demo_output_complex").setContent(Y.dump(Y.DataSchema.XML.apply(schema, data_in)));
188
}, "#demo_apply_complex");
190
Y.on("click", function(e){
191
var data_in = Y.DataType.XML.parse('<desserts><dessert type="treat"><name>cupcake</name><flavors><flavor name="chocolate"/><flavor name="red velvet"/></flavors></dessert><dessert type="treat"><name>ice cream</name><flavors><flavor name="chocolate"/><flavor name="strawberry"/><flavor name="vanilla"/></flavors></dessert><dessert type="treat"><name>pie</name><flavors><flavor name="banana cream"/><flavor name="blueberry"/><flavor name="cherry"/></flavors></dessert><dessert type="beverage"><name>hot chocolate</name></dessert><dessert type="beverage"><name>port wine</name></dessert></desserts>'),
193
resultListLocator: "dessert",
195
{key:"type", locator:"@type"},
196
{key:"name", locator:"name"},
197
{key:"flavors", schema: {
198
resultListLocator: "flavor",
200
{key:"flavor", locator:"@name"}
205
Y.one("#demo_output_nested").setContent(Y.dump(Y.DataSchema.XML.apply(schema, data_in)));
206
}, "#demo_apply_nested");
212
<p>In order to use DataSchema.XML, input data must be an XML document.</p>
214
<pre class="code prettyprint">YUI().use("datatype-xml", "dataschema-xml", function(Y) {
215
var data_in = Y.DataType.XML.parse('<root><session>34637542</session><category name="music" id="5"><results><song id="59672468"><title>I Kissed A Girl</title><rank>1</rank><artist id="30326214">Katy Perry</artist></song><song id="47973564"><title>Shake It</title><rank>2</rank><artist id="45575683">Metro Station</artist></song><song id="52207363"><title>Bleeding Love</title><rank>3</rank><artist id="37956508">Leona Lewis</artist></song></results></category></root>'),
217
resultListLocator: "song",
218
// Or simply ["title", "artist", "rank"]
219
resultFields: [{key:"title"}, {key:"artist"}, {key:"rank"}]
221
data_out = Y.DataSchema.XML.apply(schema, data_in));
227
<p>The data itself can get fairly complex, with deeply nested nodes and values held in attributes. In your schema, you can use XPath notation to define these locations.</p>
229
<pre class="code prettyprint">YUI().use("datatype-xml", "dataschema-xml", function(Y) {
230
var data_in = Y.DataType.XML.parse('<Response><Session>542235629</Session><Tracks start="1" count="10" total="98" errorCount="0" defaultSort="popularity+" description="Top 100 Tracks" name="Top 100 Tracks" ><Track id="59672468" rating="-1" title="I Kissed A Girl"><Artist id="30326214" rating="-1">Katy Perry</Artist><ItemInfo><ChartPosition last="26" this="1"/></ItemInfo></Track><Track id="47973564" rating="-1" title="Shake It"><Artist id="45575683" rating="-1">Metro Station</Artist><ItemInfo><ChartPosition last="27" this="2"/></ItemInfo></Track><Track id="52207363" rating="-1" title="Bleeding Love"><Artist id="37956508" rating="-1">Leona Lewis</Artist><ItemInfo><ChartPosition last="28" this="3"/></ItemInfo></Track></Tracks></Response>'),
232
metaFields: {session:"//Session", total:"//Tracks/@total"},
233
resultListLocator: "//Track",
235
{key:"song", locator:"@title"},
236
{key:"artist", locator:"Artist"},
237
{key:"rank", locator:"ItemInfo/ChartPosition/@this"}
240
data_out = Y.DataSchema.XML.apply(schema, data_in));
246
<p>Nested schemas are supported as of version 3.1:</p>
248
<pre class="code prettyprint">YUI().use("datatype-xml", "dataschema-xml", function(Y) {
249
var data_in = Y.DataType.XML.parse('<desserts><dessert type="treat"><name>cupcake</name><flavors><flavor name="chocolate"/><flavor name="red velvet"/></flavors></dessert><dessert type="treat"><name>ice cream</name><flavors><flavor name="chocolate"/><flavor name="strawberry"/><flavor name="vanilla"/></flavors></dessert><dessert type="treat"><name>pie</name><flavors><flavor name="banana cream"/><flavor name="blueberry"/><flavor name="cherry"/></flavors></dessert><dessert type="beverage"><name>hot chocolate</name></dessert><dessert type="beverage"><name>port wine</name></dessert></desserts>'),
251
resultListLocator: "dessert",
253
{key:"type", locator:"@type"},
254
{key:"name", locator:"name"},
255
{key:"flavors", schema: {
256
resultListLocator: "flavor",
258
{key:"flavor", locator:"@name"}
263
data_out = Y.DataSchema.XML.apply(schema, data_in));
271
<div id="sidebar" class="yui3-u">
275
<div class="sidebox">
277
<h2 class="no-toc">Examples</h2>
281
<ul class="examples">
284
<li data-description="Schema parsing a JavaScript array.">
285
<a href="dataschema-array.html">DataSchema.Array</a>
290
<li data-description="Schema parsing JSON data.">
291
<a href="dataschema-json.html">DataSchema.JSON</a>
296
<li data-description="Schema parsing XML data.">
297
<a href="dataschema-xml.html">DataSchema.XML for XML Data</a>
302
<li data-description="Schema parsing data held in TABLE elements.">
303
<a href="dataschema-table.html">DataSchema.XML for HTML Tables</a>
308
<li data-description="Schema parsing delimited plain-text data.">
309
<a href="dataschema-text.html">DataSchema.Text</a>
314
<li data-description="Parsing data into specified types as the schema is being applied.">
315
<a href="dataschema-parsing.html">Enforcing DataTypes</a>
337
<div class="sidebox">
339
<h2 class="no-toc">Examples That Use This Component</h2>
343
<ul class="examples">
358
<li data-description="The Local DataSource manages retrieval of in-page data, from JavaScript arrays and objects to DOM elements.">
359
<a href="../datasource/datasource-local.html">DataSource.Local</a>
364
<li data-description="The Get DataSource, which manages retrieval of data from remote sources via the Get Utility, can be useful for accessing data from cross-domain servers without the need for a proxy.">
365
<a href="../datasource/datasource-get.html">DataSource.Get</a>
370
<li data-description="The IO DataSource manages retrieval of data from remote sources, via the IO Utility.">
371
<a href="../datasource/datasource-io.html">DataSource.IO</a>
376
<li data-description="The Function DataSource, which manages retrieval of data from a JavaScript function, provides a highly customizeable mechanism for implementer-defined data retrieval algorithms">
377
<a href="../datasource/datasource-function.html">DataSource.Function</a>
382
<li data-description="Use the DataSourceCache plugin to enable caching and reduce server calls to remote sources.">
383
<a href="../datasource/datasource-caching.html">DataSource with Caching</a>
388
<li data-description="The DataSourceCache plugin supports offline caching so that cached data persists across browser sessions.">
389
<a href="../datasource/datasource-offlinecache.html">DataSource with Offline Cache</a>
401
<script src="../assets/vendor/prettify/prettify-min.js"></script>
402
<script>prettyPrint();</script>