1. #1
    Sencha User
    Join Date
    Aug 2011
    Location
    Plymouth, UK
    Posts
    137
    Vote Rating
    -2
    simondavies has a little shameless behaviour in the past

      0  

    Question Nested List toolbar adding a home button and edit back

    Nested List toolbar adding a home button and edit back


    I have sorted out my nested list etc but I want to put a home button on the right hand side and have tried all the other methods I know but nothing.

    For the Home button I would like to use the following:
    {iconCls: 'home', iconMask: true, id: 'homeBtn'}

    Also I would like to use an icon for the back button but still no luck on this either, my other ones use {iconCls: 'arrow_left', iconMask: true, id: 'backBtn'... etc

    I can hide the toolbar generic one and add my own docked item one but I do not get the back button effect that the toolbar one uses etc.

    Thanks

  2. #2
    Sencha User
    Join Date
    Aug 2011
    Location
    Plymouth, UK
    Posts
    137
    Vote Rating
    -2
    simondavies has a little shameless behaviour in the past

      0  

    Question


    Bump - Is there no whay to add another button to the Nestedlust toolbar on the right hand side???

  3. #3
    Sencha User
    Join Date
    Aug 2011
    Location
    Plymouth, UK
    Posts
    137
    Vote Rating
    -2
    simondavies has a little shameless behaviour in the past

      0  

    Post


    I seemed to have sorted this, the easy way: Doh!

    toolbar: {
    items: [{xtype: 'spacer'},{iconCls: 'home', iconMask: true, id: 'homeBtn'}]
    },

    Thanks

  4. #4
    Sencha User
    Join Date
    Sep 2011
    Location
    Sallanches, France
    Posts
    371
    Vote Rating
    1
    myput is on a distinguished road

      0  

    Default


    Hello simondavies,

    you seems take the solution;
    I research like you a button, in my nestedList, able to come back to the first page of the nestedList.
    With your home button, it's working for you?
    Can you show me the solution for that please ?

    Thanks

  5. #5
    Sencha User
    Join Date
    Aug 2011
    Location
    Plymouth, UK
    Posts
    137
    Vote Rating
    -2
    simondavies has a little shameless behaviour in the past

      0  

    Question


    Hi ya, sorry just back at work and getting through things, can you let me knwo what your after and code that your using and will have a look.

  6. #6
    Sencha User
    Join Date
    Sep 2011
    Location
    Sallanches, France
    Posts
    371
    Vote Rating
    1
    myput is on a distinguished road

      0  

    Default


    Code:
    WPApp.views.DirectoryItemListContainer = new Ext.Panel ({
    	id: 'WPApp.views.DirectoryItemListContainer',
    	fullscreen: true,
    	layout: 'card',
    	items: [WPApp.views.DirectoryListItemPanel, WPApp.views.DirectoryDetailPanel],
    });
    
    
    WPApp.views.DirectoryNestedListPanel = Ext.extend(Ext.Panel,{
    	id: 'WPApp.views.DirectoryNestedListPanel',
    	items: [{
    		xtype: 'nestedlist',
    		id: 'nestedlist',
    		title: WPApp.config._DirectoryTitle,
    		store: WPApp.stores.DirectoryNestedListStore,
    		fullscreen: true,
    		singleSelect: true,
    		displayField: 'name',
    		useTitleAsBackText: false,
    		backText: ' ',
    		getItemTextTpl: function() {
    			var tplConstructor = loadURL(WPApp.config.host + WPApp.config.DirectoryTPL + 'DirectoryNestedListPanel.html');
    			return tplConstructor;
    		},
    		getDetailCard: function(item, parent) {
    			var itemData = item.attributes.record.data;
    			parentData = parent.attributes.record.data;
    			var DetailPanel = new Ext.Panel({
    				recordNode: item,
    				layout: 'fit',
    				items: [WPApp.views.DirectoryItemListContainer],
    				listeners: { beforeDestroy: function() { return false; } }
    			});
    			DetailPanel.update(itemData);
    			Ext.getStore(WPApp.stores.DirectoryItemListListStore).setId(itemData.idCategorie);
    			return DetailPanel;
    		},
    		listeners: {
    			afterrender: function() {
    				this.toolbar.remove(this.backButton);
    				this.backButton = new Ext.Button({
    					ui: 'plain',
    					iconMask: true,
    					useTitleAsBackText: false,
    					iconCls: 'arrow_left',
    					scope: this,
    					handler: this.onBackTap
    				});
    				this.toolbar.add(this.backButton);
    			},
    			scope: WPApp.views.DirectoryNestedListPanel
    		},
    	}]
    });
    Thanks, i have a nestedlist, and after a list in the detailPanel. i would like in the toolbar a home button like you... And if know how to hide the nestedList toolbar when i'm coming in the list.

    Thanks by advance

  7. #7
    Sencha User
    Join Date
    Aug 2011
    Location
    Plymouth, UK
    Posts
    137
    Vote Rating
    -2
    simondavies has a little shameless behaviour in the past

      0  

    Question


    to get my home button i placed the following code:
    Code:
    toolbar: {
            componentCls: 'x-toolbar-dark',
            items: [{xtype: 'spacer'},{iconCls: 'home',  iconMask: true, id: 'homeBtn'}]
        },
    I placed my just after the "backText: ' '" like below:

    Code:
    backText: ' ',
    toolbar: {
    
            componentCls: 'x-toolbar-dark',
            items: [{xtype: 'spacer'},{iconCls: 'home',  iconMask: true, id: 'homeBtn'}]
        },
    then to have the hom ebutton working within the controller for this list i placed the following code:

    Code:
    var homeBtn = this.application.viewport.query('#homeBtn')[0];
            homeBtn.setHandler(function(){
                Ext.dispatch({
                    controller: 'app',
                    action: 'index',
                    historyUrl: '#app/index',
                    animation: {
                        type: 'fade',
                        reverse: true
                    },
                });
            });
    Hope this helps?

    With regards to your next question:

    And if know how to hide the nestedList toolbar when i'm coming in the list.

    Can you elaborate a bit more no this.

    Thanks

  8. #8
    Sencha User
    Join Date
    Sep 2011
    Location
    Sallanches, France
    Posts
    371
    Vote Rating
    1
    myput is on a distinguished road

      0  

    Default


    Hum, i understand the method. But the function:

    Code:
    var homeBtn = this.application.Viewport.query('#homeBtn')[0];
    homeBtn.setHandler(function(){
    	Ext.dispatch({
    		controller: WPApp.controllers.directoryController,
    		action: 'index',
    		historyUrl: '#app/index',
    		animation: {
    			type: 'fade',
    			reverse: true
    		},
    	});
    });
    send me an error, white page.
    in my controller, i have:

    Code:
    WPApp.controllers.directoryController = new Ext.Controller({
    
    
    	index: function(options) {
    		WPApp.views.Viewport.setActiveItem(WPApp.views.DirectoryPanel, options.animation);
    	},
    
    
    });
    What is the goal of the historyUrl ?
    and can you see the problem?

    My question was:
    We can with your method modify the nestedList toolbar, then, i would like to know if we can hide the toolbar when we want ?
    for example,
    i have my normal nestedlist toolbar, and when i come in the detailPanel of the nestedlist, i have a list. When i go to an item of the list, i create a toolbar with title of the item, but unfortunatly, i have 2 toolbar ... The nestedList toolbar and the toolbar of the item ...
    Is it possible to hide at the moment of itemTap list the nestedList toolbar ?

    Thanks for your help

  9. #9
    Sencha User
    Join Date
    Aug 2011
    Location
    Plymouth, UK
    Posts
    137
    Vote Rating
    -2
    simondavies has a little shameless behaviour in the past

      0  

    Question


    Not a problem,

    For the homepage button I have the following within my Controller for say one of my views:

    Code:
    ,
            //--  
      groupsPage: function()
        {
           if ( ! this.groupsPageView){
                            this.groupsPageView = this.render({
                                    xtype: 'groupsPage',
                            });
                    }
     
        this.application.viewport.setActiveItem(this.groupsPageView);
        
            var homeBtn = this.application.viewport.query('#homeBtn')[0];
            homeBtn.setHandler(function(){
                Ext.dispatch({
                    controller: 'app',
                    action: 'index',
                    historyUrl: '#app/index',
                    animation: {
                        type: 'fade',
                        reverse: true
                    },
                });
            });
        },.....
            //
    What this does it connects my home button named: #homeBtn with the code in the toolbar, so it attaches the event to that toolbar button.

    The function simply lest the site know what page to view and the animation used when the home button is clicked.

    So the history url is basically saying on home button click open the index view, which is my home page.

    Hope this helps.

    With regards to your Toolbar hidden, there is a way by using the variable 'useToolbar:false', within the nestedlist code but from memory this will also hide it form the list views as well??

    Another way woudl be to use css display:none; etc in your details view to target the toolbar, you coudl do this in the itme tap not sure unless I can recreate what your doing.

    Si

  10. #10
    Sencha User
    Join Date
    Sep 2011
    Location
    Sallanches, France
    Posts
    371
    Vote Rating
    1
    myput is on a distinguished road

      0  

    Default


    Ok thanks for the answer.
    I Added the button in my nestedList toolbar, and in the controller, added the function;
    When i click on the button with an alert, it's okey i can see the alert but nothing after.

    my controller:
    Code:
    Ext.regController('Directory', {
    	
    	index: function(options) {
    		if ( ! this.indexView) {
    			this.indexView = this.render({
    				xtype: 'DirectoryIndex',
    			});
    		}
    		this.application.viewport.setActiveItem(this.indexView, options.animation);
    		var homeBtn = this.application.viewport.query('#homeBtn')[0];
    		        homeBtn.setHandler(function(){
    		            Ext.dispatch({
    		                controller: 'Directory',
    		                action: 'index',
    		                historyUrl: '#Directory/index',
    		                animation: {type: 'fade', reverse: true},
    		            });
    		        });
    	},
    	
    });
    It's strange because i call the same view, the url is good ...
    http://localhost:8888/App/#Directory/index

    Can you see the problem?

Thread Participants: 1

Tags for this Thread

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..."