PDA

View Full Version : Updating Title in Nested List on the leaf page



tldes
1 Feb 2012, 6:36 AM
I am having trouble figuring out what I need to do to get the title of the final destination page of a nested list to update. The title updates as it should throughout the list navigation but when you get to the destination page, it reverts back to the main page title. I am using Sencha 1.1.1 and have posted my store code and relevant page code below.

You can view the test site at http://www.medcgroup.com/mea

Nested List (maincard.js)


MeaMobile.views.Maincard = Ext.extend(Ext.NestedList, {
fullscreen: true,
title: "Home",
iconCls: "home",
updateTitleText: true,
cardSwitchAnimation: 'slide',

initComponent: function() {
Ext.apply(this, {
store: MeaMobile.menustore,
getDetailCard: function(item, parent) {
var itemData = item.attributes.record.data;
return itemData.card;
}
});
MeaMobile.views.Maincard.superclass.initComponent.apply(this, arguments);
}
});
Ext.reg('maincard', MeaMobile.views.Maincard);

Main page (homecard.js)

MeaMobile.views.Homecard = Ext.extend(Ext.TabPanel, {
title: "Welcome",
iconCls: "home",

initComponent: function() {
Ext.apply(this, {
defaults: {
styleHtmlContent: true
},
items: [
{ xtype: 'maincard'
},
{
title: 'About',
scroll: 'vertical',
html: '<p>McDonald Eye Information here.</p>'
}]
});
MeaMobile.views.Homecard.superclass.initComponent.apply(this, arguments);
}
});


Ext.reg('homecard', MeaMobile.views.Homecard);


Data (menustore.js)


MeaMobile.menustore = new Ext.data.TreeStore({
model: 'ListItem',
root: {
items: [{
text: 'Doctors',
items: [
{
text: 'Chad Betts, M.D., R.Ph.',
card: {xtype: 'bettscard'},
leaf: true
},
{
text: 'Brad Talley, M.D.',
card: {xtype: 'talleycard'},
leaf: true
},
{
text: 'Jay McDonald II, M.D.',
card: {xtype: 'mcdonaldcard'},
leaf: true
},
{
text: 'Dusty McIver, O.D.',
card: {xtype: 'mcivercard'},
leaf: true
},
{
text: 'Vivi Fretland, O.D.',
card: {xtype: 'fretlandcard'},
leaf: true
}
]
}, //end doctors
{
text: 'Vision Services',
items: [
{
text: 'Optical',
card: {xtype: 'opticalcard'},
leaf: true
},
{
text: 'Glaucoma',
card: {xtype: 'glaucomacard'},
leaf: true
},
{
text: 'Dry Eye',
card: {xtype: 'dryeyecard'},
leaf: true
}
]
}, // end vision services
{
text: 'LASIK',
items: [
{
text: 'LASIK Information',
card: {xtype: 'lasikcard'},
leaf: true
},
{
text: 'Screening',
card: {xtype: 'lasikscreeningcard'},
leaf: true
},
{
text: 'The Prodedure',
card: {xtype: 'lasikprocedurecard'},
leaf: true
},
{
text: 'FAQ',
card: {xtype: 'lasikfaqcard'},
leaf: true
},
{
text: 'Testimonials',
card: {xtype: 'lasiktestimonialcard'},
leaf: true
}
]
}, // end LASIK
{
text: 'Cataracts',
items: [
{
text: 'Cataract Information',
card: {xtype: 'cataractcard'},
leaf: true
},
{
text: 'Cataract Surgery',
card: {xtype: 'cataractsurgerycard'},
leaf: true
},
{
text: 'Premium Lenses',
card: {xtype: 'premlenscard'},
leaf: true
},
{
text: 'FAQ',
card: {xtype: 'cataractfaqcard'},
leaf: true
},
{
text: 'Testimonials',
card: {xtype: 'cataracttestimonialscard'},
leaf: true
}
]
}, // end Cataracts
{
text: 'Location',
items: [
{
text: 'Location',
card: {xtype: 'locationcard'},
leaf: true
}
]
}, // end location
{
text: 'Contact',
items: [
{
text: 'Contact Us',
card: {xtype: 'contactcard'},
leaf: true
}
]
} // end contact
],
},// end menu items
proxy: {
type: 'ajax',
reader: {
type: 'tree',
root: 'items'
}
}
});


Sample leaf card (First doctor in list)


MeaMobile.views.Bettscard = Ext.extend(Ext.Panel, {
id: 'bettscard',
title: 'Dr. Betts',
styleHtmlContent: true,
html: 'Doctor Information here!'
});
Ext.reg('bettscard', MeaMobile.views.Bettscard);

mitchellsimoens
1 Feb 2012, 9:38 AM
This is based on the detail card

tldes
1 Feb 2012, 10:48 AM
Yes, I am basically using the nested list as my app navigation with the detail cards being the individual pages.

noromamai
12 Feb 2012, 8:22 AM
you can set the title using


this.title = 'whatever-you-want-your-title-to-be';

if you render something custom for your detail card just add that into the


getDetailCard: function(item, parent) {}

of your nestedlist. i used it to set the title to nothing in my app.

sanket_mehta75
22 May 2012, 10:07 PM
Hey,
Can any one tell me.....how to create nested list in sencha touch2,i been through with all examples but i am not getting,i follow kitchen sink example but i got confuse in it procedure,i took reference of it it....but not happening,i am creating one app,i want nested list in bottom tab,when client tab a bottom tab then it will display a list and clicking on one panel it shows different option in nested form....
pls reply as soon as possible.

thanx:">:">