frrogoy
22 Dec 2010, 5:26 AM
This works OK in chrome and on the online iphone tester I found at www.testiphone.com (http://www.testiphone.com). I had someone test it on a real iPhone and an Android. On both real phones, the lform.hide() executes but the List.show() is not working (after a good login with data returned). The top toolbar displays, but there is no list below.
The appropriate 3 alerts are all displayed in the store load listener, so I know the data is being returned.
The code asks for login via a form, then displays a list of data (leads). What is different on the real phones?
var pwin = '';
var emlin = '';
new Ext.Application({
launch: function() {
Ext.regModel('Contact', {
fields: ['fname', 'lname','title','email','phone','interest','crby','org']
});
var listStore = new Ext.data.Store({
model: 'Contact',
proxy: {
type: 'ajax',
url: 'getleads.php',
reader: {
type: 'json',
root: 'data'
}
},
listeners: {load: {fn: function(store, records, success){
if(!store.getCount()){
Ext.Msg.alert("No Data","No leads in Assigned status.");
}else{
if(records[0].data.fname=="badlogin"){
Ext.Msg.alert("Bad Login","Email/Password combination not recognized");
}else{
Ext.Msg.alert("Lead count",store.getCount()); // test msg. being displayed.
lform.hide();
// List.fullscreen = true; // test. no effect
// List.doLayout(); // test. no effect
List.show();
}
}
}}}
});
var lform = new Ext.Panel({
fullscreen: true,
items: [{
xtype: 'form',
id: 'loginform',
submitOnAction: false,
items: [{
xtype: 'fieldset',
title: 'CIM Sales DB Login',
instructions: 'Please enter the information above.',
defaults: {
labelWidth: '30%'
},
items: [{
xtype: 'emailfield',
name: 'eml',
id: 'eml',
label: 'Email',
placeHolder: 'me@cimtechsolutions.com',
useClearIcon: true
},{
xtype: 'passwordfield',
id: 'pw',
name: 'pw',
label: 'Password',
useClearIcon: true
}]
}],
dockedItems: [{
xtype: 'toolbar',
dock: 'bottom',
items: [{
xtype: 'spacer'
},{
name: 'Login',
text: 'Log In',
centered: true,
width: 100,
handler: function(){
emlin = Ext.getCmp('eml').getValue();
pwin = Ext.getCmp('pw').getValue();
listStore.proxy.extraParams = {eml: emlin, pw: pwin};
listStore.load();
}
},{
xtype: 'spacer'
}]
}]
}]
}) // end lform
var List = new Ext.Panel({
fullscreen: true, // without this, didn't work on chrome either.
hidden: true, // also tried hiding later.
items: [{
title: 'Disclosure',
layout: Ext.is.Phone ? 'fit' : {
type: 'vbox',
align: 'center',
pack: 'center'
},
cls: 'demo-list',
items: [{
width: Ext.is.Phone ? undefined : 350,
height: Ext.is.Phone ? undefined : 500,
xtype: 'list',
scroll: 'vertical',
onItemDisclosure: function(record, btn, index) {
Ext.Msg.add({ maxHeight: 10 }); // patch to get msg to resize
Ext.Msg.doLayout();
Ext.Msg.add({ maxHeight: 1000 });
Ext.Msg.doLayout();
Ext.Msg.alert(record.get('fname') +' '+ record.get('lname'), 'Title: '+ record.get('title')+'<br />Email: '+record.get('email')+'<br />Phone: '+record.get('phone')+'<br />Interest: '+record.get('interest'),Ext.emptyFn);
},
store: listStore,
itemTpl: ['<div class="contact"><strong>{fname}</strong> {lname}</div>',
'<p style="font-size:80%">{org}</p>'
]
}],
dockedItems: [{
dock : 'top',
xtype: 'toolbar',
title: 'My Assigned Leads'
}]
}]
}) // end List
} // end launch
});
The appropriate 3 alerts are all displayed in the store load listener, so I know the data is being returned.
The code asks for login via a form, then displays a list of data (leads). What is different on the real phones?
var pwin = '';
var emlin = '';
new Ext.Application({
launch: function() {
Ext.regModel('Contact', {
fields: ['fname', 'lname','title','email','phone','interest','crby','org']
});
var listStore = new Ext.data.Store({
model: 'Contact',
proxy: {
type: 'ajax',
url: 'getleads.php',
reader: {
type: 'json',
root: 'data'
}
},
listeners: {load: {fn: function(store, records, success){
if(!store.getCount()){
Ext.Msg.alert("No Data","No leads in Assigned status.");
}else{
if(records[0].data.fname=="badlogin"){
Ext.Msg.alert("Bad Login","Email/Password combination not recognized");
}else{
Ext.Msg.alert("Lead count",store.getCount()); // test msg. being displayed.
lform.hide();
// List.fullscreen = true; // test. no effect
// List.doLayout(); // test. no effect
List.show();
}
}
}}}
});
var lform = new Ext.Panel({
fullscreen: true,
items: [{
xtype: 'form',
id: 'loginform',
submitOnAction: false,
items: [{
xtype: 'fieldset',
title: 'CIM Sales DB Login',
instructions: 'Please enter the information above.',
defaults: {
labelWidth: '30%'
},
items: [{
xtype: 'emailfield',
name: 'eml',
id: 'eml',
label: 'Email',
placeHolder: 'me@cimtechsolutions.com',
useClearIcon: true
},{
xtype: 'passwordfield',
id: 'pw',
name: 'pw',
label: 'Password',
useClearIcon: true
}]
}],
dockedItems: [{
xtype: 'toolbar',
dock: 'bottom',
items: [{
xtype: 'spacer'
},{
name: 'Login',
text: 'Log In',
centered: true,
width: 100,
handler: function(){
emlin = Ext.getCmp('eml').getValue();
pwin = Ext.getCmp('pw').getValue();
listStore.proxy.extraParams = {eml: emlin, pw: pwin};
listStore.load();
}
},{
xtype: 'spacer'
}]
}]
}]
}) // end lform
var List = new Ext.Panel({
fullscreen: true, // without this, didn't work on chrome either.
hidden: true, // also tried hiding later.
items: [{
title: 'Disclosure',
layout: Ext.is.Phone ? 'fit' : {
type: 'vbox',
align: 'center',
pack: 'center'
},
cls: 'demo-list',
items: [{
width: Ext.is.Phone ? undefined : 350,
height: Ext.is.Phone ? undefined : 500,
xtype: 'list',
scroll: 'vertical',
onItemDisclosure: function(record, btn, index) {
Ext.Msg.add({ maxHeight: 10 }); // patch to get msg to resize
Ext.Msg.doLayout();
Ext.Msg.add({ maxHeight: 1000 });
Ext.Msg.doLayout();
Ext.Msg.alert(record.get('fname') +' '+ record.get('lname'), 'Title: '+ record.get('title')+'<br />Email: '+record.get('email')+'<br />Phone: '+record.get('phone')+'<br />Interest: '+record.get('interest'),Ext.emptyFn);
},
store: listStore,
itemTpl: ['<div class="contact"><strong>{fname}</strong> {lname}</div>',
'<p style="font-size:80%">{org}</p>'
]
}],
dockedItems: [{
dock : 'top',
xtype: 'toolbar',
title: 'My Assigned Leads'
}]
}]
}) // end List
} // end launch
});