1. #1
    Ext User
    Join Date
    Oct 2010
    Posts
    27
    Vote Rating
    0
    .jpg is on a distinguished road

      0  

    Default Enable list...

    Enable list...


    Hi - am trying to get the following...

    • get list into a tabPanel... (not having much joy - but this was actually noted in a previous thread), so I can have mulitple lists arranged (or at the very least work out an accordian style function for multiple lists to exist one a single page???)
    • Wondering if anyone knows how I can set the list to have an enable function - giving each list item a delete button?
    • How can I set the list to NOT be alphabetic, just a simple list.

    Here is my code:
    Code:
    Ext.setup({
        tabletStartupScreen: 'tablet_startup.png',
        phoneStartupScreen: 'phone_startup.png',
        icon: 'icon.png',
        glossOnIcon: false,
        onReady : function() {
    		// TOOLBAR/TOP
    		var toolbar = new Ext.Toolbar ({
    			dock: 'top',
    			title: 'bodymetrics',
    			cls: 'main_bar',
    			items:[{
    			ui:'back',
    			html:'<a href="index.html">back</a>',
    			}]
    		});
    		
    		
    		
    		
    				// LIST MENU
    		var listMenu = new Ext.Toolbar ({
    			dock: 'top',
    			cls:'queuebtn',
    			items:[{
    					html:'Manual Measurement - Selfridges 3rd Floor changing rooms',
    					},{
        				xtype: 'spacer' 
    					},{ 
    					ui: 'confirm', text: 'edit'
    					}]
    			});
    			
    			
    		// ROOT PANEL
    		new Ext.Panel({
    		fullscreen: true,
    		dockedItems: [toolbar, listMenu],
    		});
    		
    		
    		// LIST 
    		Ext.regModel('Contact', {
        	fields: ['firstName', 'lastName']
    		});
    
    		var scannerOne = new Ext.data.JsonStore({
      	  	model  : 'Contact',
        	sorters: 'lastName',
    
        	getGroupString : function(record) {
            return record.get('lastName')[0];
        	},
    
    		data: [
            {firstName: 'Tommy',   lastName: 'Maintz'},
            {firstName: 'Rob',     lastName: 'Dougan'},
            {firstName: 'Ed',      lastName: 'Spencer'},
            {firstName: 'Jamie',   lastName: 'Avins'},
            {firstName: 'Aaron',   lastName: 'Conran'},
            {firstName: 'Dave',    lastName: 'Kaneda'},
            {firstName: 'Michael', lastName: 'Mullany'},
            {firstName: 'Abraham', lastName: 'Elias'},
            {firstName: 'Jim',     lastName: 'Smith'},
            {firstName: 'Lucy',    lastName: 'Jones'},
            {firstName: 'Zara',    lastName: 'Smith'},
            {firstName: 'Jane',    lastName: 'Robinson'},
            {firstName: 'Bea',     lastName: 'Pewter'},
            {firstName: 'Caroline',lastName: 'Penn'},
            {firstName: 'Jenny',   lastName: 'Graham'},
            {firstName: 'Laura',   lastName: 'Hilts'},
            {firstName: 'Alice',   lastName: 'Greene'},
            {firstName: 'Jess',    lastName: 'Philips'},
            {firstName: 'Anne',    lastName: 'Robinson'},
            {firstName: 'Jane',    lastName: 'Ronnington'},
            {firstName: 'Raj',    lastName: 'Jobbington'},
            {firstName: 'Juliet',    lastName: 'Bilbo'},
            {firstName: 'Philippa',    lastName: 'Coffee-Pot'},
            {firstName: 'Jon',    lastName: 'Little'},
            {firstName: 'Mark',    lastName: 'Little'},
            {firstName: 'Jo',    lastName: 'James'},
            {firstName: 'Anne',    lastName: 'Roberts'},
        	]
    		});
    
    		var list = new Ext.List({
        	fullscreen: true,
        
        	itemTpl : '{firstName} {lastName}',
        	indexBar: true,
    		cls:'list',
        
        	store: scannerOne
    		});
    		list.show();
    		
    		
        }
    });
    I know that I need to nest the list as an item, but cannot work out where! Any help - hugely appreciated

  2. #2
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    17,000
    Vote Rating
    650
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default


    1) The list is a component, so it works like anything else:

    Code:
    new Ext.TabPanel({
        items: [{
            title: 'List',
            xtype: 'list',
            // other list stuff
        }]
    });
    2) Check out the disclosure config

    3) You specify a sorter on the store. Remove it.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

Similar Threads

  1. Replies: 1
    Last Post: 17 Sep 2010, 3:02 AM
  2. Shuttle list or dual selection pick list
    By Whatty in forum Ext 3.x: Help & Discussion
    Replies: 3
    Last Post: 12 Nov 2009, 12:41 PM
  3. Setting list and list item styles for Html widget
    By afs in forum Ext GWT: Discussion
    Replies: 2
    Last Post: 9 Nov 2009, 2:29 AM
  4. [FNR] DND List-to-List INSERT 1.2.4 demo throwing JS errors
    By Baby Dingo in forum Ext GWT: Bugs (1.x)
    Replies: 2
    Last Post: 12 May 2009, 3:05 PM

Thread Participants: 1