Application Structure:
  • Template-and-DataView
    • app
      • controller
      • model
        • Student.js
      • store
        • Student.js
      • view
        • StudentMaster.js
    • app.js
    • default.html
    • ext-4.2.1
    • resources

Example: DataView

model\Student.js 
Ext.define('School.model.Student', {
    
    extend: 'Ext.data.Model',
    idProperty:'Id',
    
    fields: [
        { name: 'Id', type: 'int', defaultValue: 0},
        { name: 'firstName', type: 'string' },
        { name: 'middleName', type: 'string' },
        { name: 'lastName', type: 'string' },
        { name: 'birthDate', type: 'date' },
        { name: 'address1', type: 'string' },
        { name: 'address2', type: 'string' },
        { name: 'city', type: 'string' },
        { name: 'state', type: 'string' }
    ],
    
    validations: [{
        type: 'presence',
        field: 'firstName'
    }],

    proxy : 
    {
        type : 'ajax',
        reader : 
        {
            type : 'json'
        },
        api : 
        {
            read: '/ExampleService.svc/studentswithpaging/'
        },
        actionMethods : 
        {
            destroy : 'POST',
            read : 'GET',
            create : 'POST',
            update : 'POST'
        },
        enablePaging: true,
        reader: {
            root: 'Students',
            totalProperty: 'TotalCount'
        }
    }
});

Preview