hi - thats very weird - when I cick on this URL I see multiple tabs for each of the files in the senchafiddle tool - just tried on my iphone and even see the other code files.
anyways I have attached the zip of the application - includes the app.js , views and controller.
thx
So I load your app code, I enter a value in the first text field and tab to the next one which is first. I get a floating panel with a list in it. I tap on an item and it populates both the first and last fields. I am using 2.0.1 RC using Chrome 18 and iOS Simulator (iPad 5.1)
Mitchell Simoens @LikelyMitch Modus Create, Senior Frontend Engineer
________________
Need any sort of Ext JS help? Modus Create is here to help!
when line layout 'fit' is commented out causes a blank list
when line layout 'fit' is used list of names comes up but itemtap doesnt fire.
IOS 4.3.5 ipad - M_webkit 5.0.2
when line layout 'fit' is commented out list of names comes up and itemtap does fire
NOTE: when line layout 'fit' is used list of names comes up but itemtap doesnt fire.
seems like an iPhone issue for a number of versions of the browser - haven't tried on older ipad version of browser.
Lists cannot have a 'fit' layout because they scroll. They either need to be within a container that gives them size or they need to have a fixed size.
this led me to look further at the height/width settings and it turns out that the '70%' for height causes the issue e.g. when I have this code in place (code in red) then I have the problem with item tap not firing in the IOS/webkit versions listed above.
Take these lines out and just use a fixed amount (code lines in blue) and its fine.
Should the percentages work?
thx
Code:
Ext.define('MyApp.view.MyPopup', { extend: 'Ext.List', xtype: 'MyPopup', config: { modal: true, hideOnMaskTap: true, // Make it hidden by default hidden: true, centered: true, // Set the width and height of the panel width: (Ext.os.deviceType == 'Phone') ? 260 : 400, height: (Ext.os.deviceType == 'Phone') ? '70%' : 400,height: (Ext.os.deviceType == 'Phone') ? 350 : 400, // need this next line to display on iPhone but this disables itemtap on the list // layout: 'fit', items: [ { xtype: 'titlebar', docked: 'top', title: 'Pick an item' }, { xtype: 'list', itemId: 'mylist', store: 'MyStore',
// need height otherwise wont display height: ((Ext.os.deviceType == 'Phone') ? '70%' : 400) - 70,
height: ((Ext.os.deviceType == 'Phone') ? 350 : 400) - 70, itemTpl: '<div class="cities">{thing1} {thing2}</div>'} ] } , initialize: function () { console.log('initialize Popup'); this.callParent();}});