Example: Session

model\State.js

Ext.define('SchoolApp.model.State', {
    extend: 'Ext.data.Model',
    idProperty: 'Id',

    proxy: {
        type:'ajax',
        api: {
            read: '/ExampleService.svc/students/'
        },
        reader:{
            type:'json',
            rootProperty:'data'
        },
        writer: {
            allowSingle: false
        }

    },
    fields: [
        { name: 'Id', type: 'int' },
        { name: 'name', type: 'string' }
    ]
});

app.js

Ext.application({
    name: 'SchoolApp',
    autoCreateViewport: false,
    views: ['SchoolApp.view.student.StudentList', 'SchoolApp.view.student.StateList'],
    requires: ['SchoolApp.view.student.StudentViewModel'],

    launch: function () {

        Ext.create('Ext.container.Viewport', {
            layout: 'border',
            dock: 'top',
            viewModel: {
                type: 'StudentViewModel'
            },
            session: true,
            items: [
                {
                    region: 'north',
                    xtype: 'toolbar',
                    items: [{
                        text: 'Save Batch',
                        handler: function () {
                            try {
                                var viewport = this.up().up();
                                var ses = viewport.getSession();

                                var batch = ses.getSaveBatch();


                                batch.on({
                                    complete: function () {
                                        Ext.Msg.alert('Status', 'Data Saved Successfully!');
                                    },
                                    exception: function () {
                                        Ext.Msg.alert('Error', 'Error occurred');
                                    }
                                });

                                batch.start();
                            }
                            catch (ex) {
                                Ext.Msg.alert('Error', ex.message);
                            }
                        }
                    },
                    {
                        text: 'Show Changes',
                        handler: function () {
                            var viewport = this.up().up();
                            var ses = viewport.getSession();
                            var changes = ses.getChanges();

                            if (!changes) {
                                Ext.Msg.alert('Status', 'No Changes');
                                return;
                            }

                            if (changes.State && changes.State.U) // if state updated
                            {
                                var changedStateNames = "Changed State Names: ";
                                for (var i = 0; i < changes.State.U.length ; i++) {
                                    changedStateNames += changes.State.U[i].name + ", ";
                                }

                                Ext.Msg.alert('Status', changedStateNames);
                            }

                            if (changes.Student && changes.Student.U) { // if student updated
                                var changedStudentNames = "Changed Student Names: ";
                                for (var i = 0; i < changes.Student.U.length ; i++) {
                                    changedStudentNames += changes.Student.U[i].firstName + ", ";
                                }

                                Ext.Msg.alert('Status', changedStudentNames);
                            }
                        }
                    }]
                },
                {
                    region: 'center',
                    xtype: 'StudentList',
                    bind: { store: '{students}' },
                    flex: 1
                },
                {
                    xtype: 'StateList',
                    region: 'south',
                    bind: { store: '{states}' },
                    flex: 1
                }]
        });

    }
});

Preview