Currently I have a list, then when I tapped the list I should show step 1 data details for the user to update, then step 2 until the end. I would like to know the correct way of doing this, because most of the example that I saw in the internet are list > then pass the data from only one view. Please see code and screenshot below for your reference. Thank you!

TransactionMain.js (VIEW)

Code:
Ext.define('XX.view.TransactionMain',{
    extend: 'Ext.NavigationView',
    xtype: 'transmain',
    alias: 'widget.transmain',
    requires: [
        'XX.view.TransactionList',
        'XX.view.TransactionGeneralInfo',
        'XX.view.TransactionContent'
    ],
    config: {
        title: 'Transaction Main List',
        navigationBar: {
            hidden: true
        },
        layout: {
            type: 'card',
            animation: {
                duration: 200,
                easing: 'ease-out',
                type: 'slide'//,
                //direction: 'left'
            }
        },
        activeItem: 0,
        height: '100%',
        width: '100%',
        fullscreen: true,
        items: [{
            xtype: 'panel',
            title: 'Transaction Main List',
            items: [{
                xtype: 'translist', //next *1*
                height: '100%'
            },{
                xtype: 'panel',
                items: [{
                    xtype: 'transgeninfo', //next *1*
                    height: '100%'
                }]
            },{
                xtype: 'panel',
                items: [{
                    xtype: 'transcontent', //back 1 step 3 *2*
                    height: '100%'
                }]
            }]
        }]
    },
    initialize: function() {
        this.callParent(arguments);
    }
});

TransactionList.js (CONTROLLER)

Code:
Ext.define("XX.controller.TransactionList", {
    extend: 'Ext.app.Controller',
    requires: [
        'XX.view.TransactionMain',
        'XX.view.TransactionGeneralInfo',
        'XX.view.TransactionContent'
    ],
    config: {
        refs: {
            translist: 'translist',
            transgeninfo: 'transgeninfo',
            list: 'translist list',
            segmentedbutton: 'translist segmentedbutton',
            transmain: 'transmain',
            floorNo: 'transgeninfo #floorNo',
            hiddenTranID: '#hiddenTranID'
        },
        control: {
            translist: {
                initialize: 'translistInitialize'
            },
            list: {
                itemtap: 'listTap'
            },
            segmentedbutton: {
                toggle: 'segmentedButtonToggle'
            }
        }
    },
    init: function() {
        this.callParent(arguments);
    },
    translistInitialize: function(home) {
        this.refreshList(home,1);
 
        //test
        /*var list = home.down('list');
        var store = Ext.create('XX.store.remote.SalesTransaction');
        //var storetype = home.getStore();
        var proxy = store.getProxy();
        proxy.setUrl(Proxy.getUrl()+'GetTransactionDataByID?op=sp'+'&TransactionID='+'21');
        Helper.setMask(true);
        var _this = this;
        store.load({
            callback: function(records,op,success) {
                Helper.setMask(false);
                if (success) {
                    // Check status flag and display error message if necessary
                    var data = store.getProxy().getReader().rawData;
                    var _this = this;
 
                    if (data.Error) {
                        Helper.alert('Downline Reports',data.Error);
                        // Pop
                        //this.getApplication().getController('XX.controller.Main').backButtonTap();
                    }
                }
                else {
                    Helper.alert('','Unable to load data, please try again later.');
                }
            },
            scope: this
        });
        list.setStore(store);*/
        //test
    },
    refreshList: function(home,mode) {
        var list = home.down('list');
        var store = Ext.create('XX.store.remote.TransactionList');
        var proxy = store.getProxy();
        var profile = Account.get();
        proxy.setUrl(Proxy.getUrl()+'LoadMobileTransactionList?StatusID='+mode+'&ClosingSalesperson='+profile.get('username'));
        //proxy.setUrl(Proxy.getUrl()+'GetNewsAnnouncementResearch?op=nar&TypeID='+mode);
        Helper.setMask(true);
        store.load({
            callback: function(records,op,success) {
                Helper.setMask(false);
                if (success) {
 
                    // Check status flag and display error message if necessary
                }
                else {
                    Helper.alert('','Unable to load data, please try again later.');
                }
            },
            scope: this
        });
        list.setStore(store);
    },
 
 
 
    listTap: function(list, index, target, record) {
        Ext.Msg.alert('Selected!', 'You selected ' + record.get('SubmittedDate'));
 
 


 
 
        //test again again again
 
        var enquiry = list.up('transmain');
        var store = Ext.create('XX.store.remote.SalesTransaction');
        var proxy = store.getProxy();
        proxy.setUrl(Proxy.getUrl()+'GetTransactionDataByID?op=sp'+'&TransactionID='+'21');
        var url = Proxy.getUrl()+'GetTransactionDataByID?op=sp'+'&TransactionID='+'21';
        store.load({
            //callback: function(data,success) {
            callback: function(records,op,success) {
                Helper.setMask(false);
                if (success) {
                    ///console.dir(data);
                    // Check status flag and display error message if necessary
                }
                else {
                    Helper.alert('','Unable to load data, please try again later.');
                }
            },
            scope: this
        });
        var enquiryResult = Ext.create('XXTransactionList.jpgStep1.jpgTransactionList.jpgStep1.jpg.view.TransactionGeneralInfo',{
            url: url,
            store : store
        });
        console.log('url'+url);
        console.dir('store'+store);
        enquiry.push(enquiryResult);
        this.getTransmain().fireEvent('navigationMode',enquiry);
 
    },
    segmentedButtonToggle: function(container, button, pressed) {
        if (pressed) {
            var home = container.up('translist');
            switch (button.getText()) {
                case "Draft":
                    this.refreshList(home,button.config.value);
                    break;
                case "Submitted":
                    this.refreshList(home,button.config.value);
                    break;
            }
        }
    }
});