Guide applies to: modern

    The field class has a mapping config that lets you map the name of the field to the location of the value in the object.

    Expand Code

    JS Run

    1. Ext.define('MyApp.model.Movie', {
    2.     extend: 'Ext.data.Model',
    3.     fields: [{
    4.         name: 'id',
    5.         mapping: 'id.attributes["im:id"]'
    6.     }, {
    7.         name: 'movie',
    8.         mapping: '["im:name"].label'
    9.     }, {
    10.         name: 'image',
    11.         mapping: '["im:image"][2].label'
    12.     }],
    13.     proxy: {
    14.         type: 'jsonp',
    15.         url: 'https://itunes.apple.com/us/rss/topmovies/limit=5/json',
    16.         reader: {
    17.             type: 'json',
    18.             rootProperty: 'feed.entry'
    19.            }
    20.     }
    21. });
    23. Ext.define('MyApp.view.Main', {
    24.     extend: 'Ext.view.View',
    25.     store: {
    26.         model: 'MyApp.model.Movie',
    27.         autoLoad: true
    28.     },
    29.     itemTpl: '<img src="{image}">',
    30.     cls: 'movies',
    31.     itemCls: 'movie',
    32.     overItemCls: 'over',
    33.     selectedItemCls: 'selected',
    34.     emptyText: 'An Internet connection is needed to load titles from iTunes.'
    35. });
    36. Ext.application({
    37. name: 'MyApp',
    38. mainView: 'MyApp.view.Main'
    39. });