PDA

View Full Version : Trouble adding view partials



so.phis.ti.kat
31 May 2013, 7:34 AM
Hi Everyone,

I've made some progress with my first application by following Architecting Your App in Ext JS (http://www.sencha.com/learn/architecting-your-app-in-ext-js-4-part-1), including the adjustments required for Sench Touch. The one spot that I can't seem to get passed is loading some view partials.

I have a view (login screen) - data is gets loaded and templates get updated. I want separate the keypad form into it's own view as a view partial and then simply load into my login screen.

Here's my view partial...

Ext.define('MyApp.view.partial.Keypad', { extend: 'Ext.form.Panel',
xtype: 'keypadpartial',


config: {
title: 'KeypadPartial',
items: [
{
xtype: 'button',
name: 'keyChars',
label: '7'
},
{
xtype: 'button',
name: 'key0',
label: '0'
},
{
xtype: 'button',
name: 'keyDel',
label: 'Del'
},
{
xtype: 'button',
name: 'submit',
label: 'Submit'
}
]
}
});

...and here's my view

Ext.define('MyApp.view.Login', { extend: 'Ext.Container',
xtype: 'loginview',


requires: [
'MyApp.view.tpl.Login',
'MyApp.view.partial.Keypad'
],


config: {
title: 'Login',
tpl: Ext.create('DemeraraHandbook.view.tpl.Login'),
items: [
{
xtype: 'keypadpartial',
width: 200
},
{
xtype: 'button',
name: 'sample',
label: 'Button',
width: 200
}
]
}
});

I get no errors and only my second item appears (just for testing purposes). You think you can help? I can't seem to find the correct method to instantiate my Keypad and add it as the first item in my views list.

Cheers.

vadimv
31 May 2013, 9:28 AM
There are a few options: give a height to form, or a layout to container.
Buttons may be docked, in case you want for the one in the container.
In container, tpl and items don't work at the same time.

so.phis.ti.kat
31 May 2013, 10:10 AM
Ha. Can't believe it was that simple; all your suggestions worked. Thanks.