listview - How to bind the data to the list item of list view in cascades -

i'm developing blackberry 10 application cascades framework. want display categories in list view when user clicks on button. i've created 1 qml page list view.

categories.qml

import bb.cascades 1.0  page { container {     background: backgroundpaint.imagepaint     //preferredwidth: 768     //preferredheight: 1280     attachedobjects: [         imagepaintdefinition {             id: backgroundpaint             imagesource: "asset:///images/list_bg.png"         }     ]      //start of row 1     container {         preferredwidth: 748         preferredheight: 145         //background: color.blue;         /*layout: stacklayout {             orientation: layoutorientation.lefttoright                         }*/          // page header         label {             objectname: "categoriesheaderlabel"             text: "categories"             translationx: 0             translationy: 40             horizontalalignment: horizontalalignment.center             verticalalignment: verticalalignment.center                         }     }      //start of row 2     // create listview uses xml data model     listview {         datamodel: xmldatamodel {             source: "asset:///categories.xml"         }         // listitemcomponent defines how "listitem" items         // should appear. these items use container includes         // checkbox , label.         listitemcomponents: [             listitemcomponent {                 type: "category" //setting node name                 container {                     preferredwidth: 748                     preferredheight: 50                     background: color.blue                      layout: stacklayout {                         orientation: layoutorientation.lefttoright                     }                      label {                         text: listitemdata.categorynameen //setting node                          verticalalignment: verticalalignment.center                         // apply text style create title-sized font                         // normal weight                         textstyle {                             base: systemdefaults.textstyles.titletext                             fontweight: fontweight.normal                         }                     }                     container {                         horizontalalignment: horizontalalignment.fill                         verticalalignment: verticalalignment.center                         preferredwidth: 50                         preferredheight: 50                         //background: color.blue                          layout: stacklayout {                             orientation: layoutorientation.righttoleft                         }                         // arrow image                         imageview {                             verticalalignment: verticalalignment.center                             translationx: 0                             translationy: 0                             imagesource: "asset:///images/arrow.png"                             rightmargin: 10                         }                     } // end of inner container                 }//end of outer container              } // end of listitemcomponent         ]//end of listitemcomponents     }//end of listview }//end of container 

}

i'm providing xml data model list. (assets:///categories.xml)

categories.xml

 <?xml version="1.0" encoding="utf-8"?> <masterdata xmlns:xsi="http://www.w3.org/2001/xmlschema-instance"  xmlns:xsd="http://www.w3.org/2001/xmlschema"> <categorylist> <category>   <categoryid>12</categoryid>   <categorynameen>banks &amp; investments</categorynameen>   <categoryimagename>banks.png</categoryimagename>   <displayorder>1</displayorder> </category> <category>   <categoryid>15</categoryid>   <categorynameen>car rental</categorynameen>   <categoryimagename>cars.png</categoryimagename>   <displayorder>2</displayorder> </category> <category>   <categoryid>19</categoryid>   <categorynameen>services</categorynameen>   <categoryimagename>services.png</categoryimagename>   <displayorder>3</displayorder> </category> <category>   <categoryid>18</categoryid>   <categorynameen>real estate &amp; constructions</categorynameen>   <categoryimagename>construction.png</categoryimagename>   <displayorder>5</displayorder> </category> <category>   <categoryid>2</categoryid>   <categorynameen>hotels &amp; apartments</categorynameen>   <categoryimagename>hotels.png</categoryimagename>   <displayorder>7</displayorder> </category> </categorylist> </masterdata> 

after bound data displayed in list. i.e category name only. list not displaying i.e showing empty page only.

i don't know wrong in code.

thanks

you need use groupdatamodel load xml this.

    datamodel: themodel // name of groupdatamodel      attachedobjects: [ // attach these listview         groupdatamodel {             id: themodel             grouping: itemgrouping.none             sortedascending: true             sortingkeys: [""] // set key want sort         },         datasource {             id: thesource             source: "" // set xml file name             query: "/root/category" // you'll need add root node file             ondataloaded: {                 themodel.insertlist(data);                 console.log("list filled...")             }         }     ] 

this should work, if doesn't have problem xml file. right know missing root node.