1. #1
    Sencha User
    Join Date
    Feb 2013
    Posts
    4
    Vote Rating
    0
    Majere is on a distinguished road

      0  

    Default Unanswered: Same NavigationView for each menu tab: child lists opens only in first tab.

    Unanswered: Same NavigationView for each menu tab: child lists opens only in first tab.


    In my sencha touch app i have a NavigationView container which loads a panel view containing a list rendered from a store.
    I have a tab-bar in which each tab opens this NavigationView container adding, depending on which tab is tapped, some extraparams in the store used by the panel view inside the NavigationView container.
    This is working OK and for each tab i get the NavigationView container and inside it the panel view containing the right list for that tab.
    The problem is these lists have some child lists that need to be loaded when tapping a list item. I do this using the following controller that pushes in the NavigationView container another view Panel containing the child list:

    Ext.define('FirstApp.controller.Details', {
    extend: 'Ext.app.Controller',
    config: {
    refs: { // this is my NavigationView container
    placesContainer:'placesContainer' },
    control: {'placesContainer categorie list': {
    itemtap: 'chooseCategory' }
    [...]
    ,

    And my chooseCategory function is:


    chooseCategory:function(list,index,target,record){
    //these add some extra params to my store's proxy
    Ext.getStore('Articoli').getProxy().setExtraParams({ catid: record.data.id });
    Ext.getStore('Articoli').load();
    this.getPlacesContainer().push({
    // this is the target view panel
    xtype:'articoli',
    title:record.data.title,
    data:record.data }
    )}

    And this works very well but when you click on a list item, its child list is pushed inside the first tab panel. Example: i tap on the 3rd tab. The app shows the list corresponding to the 3rd tab. I tap on one of the list's items. The app loads its child list in 1st tab panel. I cannot see any changes until i tap on the first tab. There i can see loaded the child list of tab 3.

    Any help would be appreciated, I'm a newbie on Sencha

  2. #2
    Sencha User bluehipy's Avatar
    Join Date
    Mar 2010
    Location
    Romania
    Posts
    618
    Vote Rating
    29
    Answers
    67
    bluehipy will become famous soon enough bluehipy will become famous soon enough

      0  

    Default


    Child list is pushed where you specified. placesContainer I guess.
    If you have 3 tabs and each of them has a different panel associated, you need to reference them differently in controller, refs:{placesContainer1:'', placesContainer2:'', placesContainer3:''} also you have to route somehow itemtaps from specific lists to corresponding parent panels, refs add list1:'placesContainer1 > list', list2:'', list3:'', and define handlers accordingly:
    control:{
    list1:{
    itemtap:handler1
    },
    list2:{
    itemtap:handler1
    },
    list3:{
    itemtap:handler1
    }
    }

    Obviously this can be generalized at some level, but for now you can start like this
    Latest thoughts on the subject: http://joy2share.com/senchatouch/

  3. #3
    Sencha User
    Join Date
    Feb 2013
    Posts
    4
    Vote Rating
    0
    Majere is on a distinguished road

      0  

    Default


    Thank you very much bluehipy,
    I already adopted the solution you suggested to me,
    I was asking this in the forum because i thought there could be a simply way to generalize this process instead of handling each tab individually.
    Thank you any way

  4. #4
    Sencha User bluehipy's Avatar
    Join Date
    Mar 2010
    Location
    Romania
    Posts
    618
    Vote Rating
    29
    Answers
    67
    bluehipy will become famous soon enough bluehipy will become famous soon enough

      0  

    Default


    You can easily generalize it, I guess, if the operations have same pattern.
    On itemtap on a main list item, you show a child list in same parent container.
    PHP Code:
    refs:{
         
    tabpanel'tabpanel',
         
    mainList :'tabpanel list' //all lists will be selected here!
    },
    control:{
          list:{
                  
    itemtap:'onAnyListItemTap'
           
    }
    },
    onAnyListItemTap:function( list, indextargetrecordeeOpts) {
       
    //isChild is a custom flag
       
    if( list.isChild ) {
               return 
    this.doChildItemTap(list, indextargetrecordeeOpts);
        }
        
    //main list item tap

       //create child list
       
    var childList Ext.create('Ext.dataview.List',{....});
       
    //mark it as child
       
    childList.isChild true;
        
        
    //add it to same container as main list
        
    list.up('container').add(childList);

    Latest thoughts on the subject: http://joy2share.com/senchatouch/

Thread Participants: 1