Results 1 to 2 of 2

Thread: help with a tabPanel, data and sliders

  1. #1
    Ext User
    Join Date
    Oct 2010
    Posts
    27

    Default help with a tabPanel, data and sliders

    Am trying to put together a screen that shows 3 levels of information from a store. Two of which are static but one can be edited. I want the amendable info to on sliders. I have so far built a 3 card TabPanel that can hold the 3 screens (2 static screens and one that can change the info).

    Her is an image of what I hope to achieve...

    does anyone have any ideas. Will post my code up in another screen.

    thanks
    Attached Images Attached Images

  2. #2
    Ext User
    Join Date
    Oct 2010
    Posts
    27

    Default

    here is the code that I have so far...

    Code:
    Ext.setup({
    	tabletStartupScreen: '',
    	PhoneStartupScreen: '',
    	icon: '',
    	glossOnIcon: false,
    	onReady: function(){
    		var panel, toolbarTop, recommendation, refresh;
    		
    		toolbarTop = new Ext.Toolbar ({
    		dock: 'top',
    		cls: 'main_bar',
    			title: 'page info',
    			type: 'hbox',
    			pack: 'center',
    			align: 'stretch',
    		items:[
    			{
    			ui:'back',
    			html: '<a href="index.html">???</a>',
    			},
    		]
    		});
    		
    		recommendation = new Ext.Component ({
    			title: 'recommendation',
    			tpl: [
    				'<tpl for=".">',
                        '<div class="clientRec">',
                                '<div class="scan"><img src="{scan_img_url}" /></div>',
                                '<div class="client-content">',
                                    '<h2>{from_user}</h2>',
                                '</div>',
                        '</div>',
    				'</tpl>'
    				 ],
    			
    		});
    			
    		measurements = {
    			title: 'measurements',
    			items: [{
           				title: 'Sliders',
    					items: [{
    							xtype: 'fieldset',
    							defaults: {
    							labelAlign: 'right'
                				},
               			items: [{
                   		xtype: 'slider',
                    	name: 'value',
                		}]
            		}]
    				}]
    
    		}
    			
    		edit = {
    			title: 'edit',
    			html: 'edit page',
    			}
    		
    		panel = new Ext.TabPanel({
    			fullscreen: true,
    			cardSwitchAnimation: {type:'slide', duration:800}, 
    			dockedItems: [toolbarTop],
    			items:[recommendation, measurements, edit]
    		});
    		
    		refresh = function() {
    			var clientRec = {
    				from_user: 'Jane Doe',
    				scan_img_url:'images/body.jpg',
    			};
    			recommendation.update(clientRec); // UPDATE THE CLIENT INFO
    		}
    		
    		refresh();
    	}
    });

Similar Threads

  1. [solved] Range Sliders
    By smithloganj in forum Ext 3.x: Help & Discussion
    Replies: 16
    Last Post: 6 Jul 2010, 3:26 PM
  2. Sliders and accordian layout
    By gorilla076 in forum Ext GWT: Help & Discussion (1.x)
    Replies: 1
    Last Post: 14 Jun 2010, 9:17 AM
  3. MultiTrack Sliders -- Please Help
    By emaint in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 18 Feb 2010, 8:38 AM
  4. sliders for panel-scrolling?
    By tobiu in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 2 Oct 2008, 2:46 PM
  5. Sliders into Grid cells?
    By RayZ in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 11 Jul 2008, 7:38 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •