Mapping XML child elements to a Kendo UI DataSource -


i'm struggling mapping , displaying list of child elements on xml datasource, using kendo ui mobile.

consider following straightforward xml structure:

<?xml version="1.0" encoding="utf-8" standalone="yes"?> <topics>     <topic id="1" title="weather">         <header>great weather today!</header>         <smallicon>foo_bar.png</smallicon>         <items>             <item>it's great weather</item>             <item>sunny feeling</item>             <item>raining dog</item>         </items>     </topic>      <topic id="2" title="politics">         <header>left or right, take pick!</header>         <smallicon>whatever.png</smallicon>         <items>             <item>making budget cuts</item>             <item>how important healthcare?</item>         </items>     </topic> </topics> 

reading each single topic, , binding view template, in fact quite easy. so:

var template = kendo.template($("#home-tpl").html());  // hook datasource "change" event; auto-population datasource.bind("change", function(e) {      $("#home-menu").html(kendo.render(template, this.view())); });  var datasource = new kendo.data.datasource({     transport: {         read: {             url: "topics.xml",              datatype: "xml"         }     },     schema: {         type: "xml",         data: "/topics/topic",         model: {             fields: {                 id: "@id",                 title: "@title",                 header: "header/text()",                 smallicon: "smallicon/text()",                  // > question: how map this?                 items: "???"             }         }     }  datasource.read(); 

this seems blend fine attributes , elements on top level. list of topics , can bind them template using #: data.title #. blends , no questions here.

however, want map child elements each <topic> well. in xml example means list of <items>. it's "how-to-map-this-schema" part i'm puzzled on.

the eventual goal display list of these sub-items, example in: #: data.items[0] #.

also, i've tried hierarchicaldatasource, regular datasource seems work fine. perhaps better fit? kendo api documentation doesn't seem provide xml samples have nested hierarchy.

any suggestions on how can accomplish this?

after trial , error came following solution:

schema: {     type: "xml",     data: "/topics/topic",     model: {         fields: {             id: "@id",             title: "@title",             header: "header/text()",             smallicon: "smallicon/text()",              // > anwer: how             children: "items"         },         haschildren: "items"     } } 

now there 2 changes in snippet in comparison original question:

  1. the children: "items" node added schema
  2. the haschildren: "items" property

with in place, worked out , hierarchical structure mapped nicely. bonus, i'm able following:

        // fetch one, single topic datasource         topic = datasource.topics.get(topicid);          // read inner contents, e.g. text, single <items> node         log(topic.children.item[0]["#text"]); 

perhaps it's of others in future...


Comments

Popular posts from this blog

Ansible - ERROR! the field 'hosts' is required but was not set -

customize file_field button ruby on rails -

SoapUI on windows 10 - high DPI/4K scaling issue -