Geek asks and answers

Sencha touch 2 - how to manage story support

I want to use a routing system to support the back button. I am showing a list of items based on the vault. when I handle the itemtap event function(list, index, target, record), I get a link to the selected entry, which I pass to the new screen that I create and show.

in this scenario, how do I tell the story manager that I switched to a new screen and turned on the back button. I see application.redirectTo, but I would lose my link to the entry I want to use. (redirectTo will trigger a new action on the stack stack, which includes the main identifier of the record, but this seems redundant, since then I will need to re-find the record based on the identifier when I process the redirect.)

Is there a direct way to tell the story object to move to a new action, as well as enable back button support?

+3
source share
1 answer

I did not find how to do this. This is how I do it in my application (with a nested list). I created a controller with this routing:

Ext.define('MyApp.controller.ListItems', {
    extend: 'Ext.app.Controller',

    config: {
            refs: {
                    nestedList: '.nestedlist'
            },
            control: {
                    nestedList: {
                            itemtap: 'itemSelected'
                    }
            },
            routes: {
                    'item/:id': 'showListItem'
            }
    },

    list: null,
    index: null,
    target: null,
    record: null,
    showListItem: function( id ){
            var nestedList = this.getNestedList(),
                    store = nestedList.getStore(),
                    node = store.getById(id);
            if ( node.isLeaf() ){
                    nestedList.goToLeaf(node);
                    nestedList.fireEvent('leafitemtap', nestedList, this.list, this.index, this.target, this.record);
            } else {
                    nestedList.goToNode(node);
            }
    },
    itemSelected: function( nl, list, index, target, record ){
            this.list = list;
            this.index = index;
            this.target = target;
            this.record = record;
            var path = 'item/'+record.data.id;
            this.redirectTo(path);
    }
});

I also redefined the inItemTap method of the nested list for all changes to the list now performed using the controller and propper routing.

onItemTap: function(list, index, target, record, e){
    this.fireEvent('itemtap', this, list, index, target, record, e);
}

Hope this will be helpful. Write here if you find a better way, please.

+1
source

More articles:


All Articles