XML Reader Does Not Bind Values To Model In Sencha Touch

This was annoying. The Sencha Touch documentation is really bad. I wanted to display data through XML instead of their preferred JSON option. Sure, it is possible but what the samples and even those in the forums failed to show is the one thing that will make it work.

The solution is the keyword mapping in a model class.

The field names are different than the tag names in the XML where case sensitivity is the factor. If your XML looks like this …

<Users>
  <User>
   <Name>tech</Name>
   <Id>1</Id>
  </User>
</Users>

And in your model class your field name is specified as

Ext.define('SS.model.User', {
    extend: 'Ext.data.Model',
    config: {
        fields: [
            { name: 'name', type: 'string' }
        ]
    }
});

Then when you load the XML data into the store’s reader, the field values will always return null.

In order for this to work, you will have to include the mapping attribute in the model class and declare the XML tag there (see code below).

fields: [
    { name: 'name', type: 'string', mapping: 'Name' }
]

I hope this post helped you!