PDA

View Full Version : Ext.picker.Picker did get shown over Ext.tab.Panel. Bug or not?



SunboX
2 Nov 2011, 6:26 AM
I try to show an Picker over an TabPanel. The TabPanel get masked, but no Picker get shown. Is this a Bug or do I something wrong?

Demo:
http://jsfiddle.net/QYJpc/19/

Demo Code:

Ext.setup({
onReady: function() {
var tabPanel = Ext.create('Ext.TabPanel', {
fullscreen: true,
tabBarPosition: 'bottom',

defaults: {
styleHtmlContent: true
},

items: [
{
title: 'Home',
iconCls: 'home',
html: 'Home Screen'
},
{
title: 'Contact',
iconCls: 'user',
html: 'Contact Screen'
},
{
xtype: 'picker',
slots: [{
name : 'test',
data : [
{text: 'Test 1', value: '1'},
{text: 'Test 2', value: '2'}
]
}]
}
]
});
tabPanel.down('picker').show();
}
});

greetings Sunny

AndreaCammarata
8 Nov 2011, 1:23 AM
Hi SunboX.
Why are you setting a picker component as a tab inside a TabPanel?
Why don't you define your picker somewhere in your code and then you show it when you need it?

SunboX
8 Nov 2011, 1:38 AM
Good question(s). Second first, I wanted to separate view from logic. So I defined the picker in the view. Your first question, I thought TabPanel will check that´s a Picker and will show it as an overlay.

Should I wrap the whole view in an normal Panel with both components inside, the TabPanel and the Picker?

greetings Sunny

AndreaCammarata
8 Nov 2011, 1:46 AM
Actually from my point of view a Picker is not really part of a view.
If you are using MVC then you could show it directly from your controller and then, looking at the user selected options, call the associated handler function in your controller that will be able to handle the view.

SunboX
8 Nov 2011, 1:56 AM
Ok, will move the creating into the controller. Thx for your suggestion! :o)

One side note, is there any way to have multiple controllers? My controller get messed up at this time. Too much code inside it. (a control() call for every button aso.) I would have something like "modules" with own controllers. But don´t know how to do this the right way.

greetings Sunny

AndreaCammarata
8 Nov 2011, 2:06 AM
I suggest you to take a look at this great tutorial written by Tommy Maintz on how to architecting applications in ExtJS 4. I know you are talking about Sencha Touch 2, but MVC pattern is almost the same, and this article give you good knowledge on how to do that.

http://www.sencha.com/learn/architecting-your-app-in-ext-js-4-part-1/

Hope this helps.

SunboX
8 Nov 2011, 2:15 AM
Thx a lot! :o)

For reference:
http://www.sencha.com/learn/architecting-your-app-in-ext-js-4-part-3/

deepaknair.g
8 Nov 2011, 2:16 AM
I suggest you to take a look at this great tutorial written by Tommy Maintz on how to architecting applications in ExtJS 4. I know you are talking about Sencha Touch 2, but MVC pattern is almost the same, and this article give you good knowledge on how to do that.

Hope this helps.

Hi,
can you provide the link of the tutorial by Tommy Maintz on how to architecting applications in ExtJS 4,which you have mentioned in the previous post.

deepaknair.g
8 Nov 2011, 2:18 AM
Thank you....:)

deepaknair.g
8 Nov 2011, 2:47 AM
I suggest you to take a look at this great tutorial written by Tommy Maintz on how to architecting applications in ExtJS 4. I know you are talking about Sencha Touch 2, but MVC pattern is almost the same, and this article give you good knowledge on how to do that.

Hope this helps.


Hi,
If we should follow like extjs4 MVC format, then should we include the library files ,as in Ext JS4

SunboX
8 Nov 2011, 3:04 AM
Hm, can´t get it working:

http://jsfiddle.net/QYJpc/26/

Shouldn´t this work? The tutorial by Tommy Maintz mentioned, I can define controllers inside an controller definition like I did in application definition?

greetings Sunny

AndreaCammarata
8 Nov 2011, 3:12 AM
Hi,
If we should follow like extjs4 MVC format, then should we include the library files ,as in Ext JS4

Yes, the Ext.Loader is also available in Sencha Touch 2 and its highly recommended to use it for dynamically load your application dependencies.

SunboX
8 Nov 2011, 3:16 AM
Sry, wrong Link, forgotten to hit "update" ;o)

This didn´t work: http://jsfiddle.net/QYJpc/26/

Any suggestions?

AndreaCammarata
8 Nov 2011, 3:18 AM
Hm, can´t get it working:

http://jsfiddle.net/QYJpc/26/

Shouldn´t this work? The tutorial by Tommy Maintz mentioned, I can define controllers inside an controller definition like I did in application definition?

greetings Sunny

You have to add your controllers in your application definition and not inside other controllers.

SunboX
8 Nov 2011, 3:22 AM
You have to add your controllers in your application definition and not inside other controllers.

This Way? http://jsfiddle.net/QYJpc/27/

Didn´t work either.

SunboX
8 Nov 2011, 3:26 AM
Quote from tutorial by Tommy Maintz:


The stores, models, controllers and views configurations also exist in Controllers and work exactly the same way as they do in the Application instance.

AndreaCammarata
8 Nov 2011, 5:31 AM
This Way? http://jsfiddle.net/QYJpc/27/

Didn´t work either.

You have to call the "getController" method...
http://docs.sencha.com/touch/2-0/#!/api/Ext.app.Controller-method-getController



Ext.define('Test.controller.Main', {
extend: 'Ext.app.Controller',
init: function() {
var controller = this.getController('Action1');
controller.doLog();
}
});


Ext.define('Test.controller.Action1', {
extend: 'Ext.app.Controller',
doLog: function() {
console.log('Hello World!');
}
});


Ext.application({
name: 'Test',


controllers: [
'Main',
'Action1'
],
launch: function() {



}
});

(http://docs.sencha.com/touch/2-0/#!/api/Ext.app.Controller-method-getController)

SunboX
8 Nov 2011, 5:37 AM
Ah, nice! Thx for enlighten me. :D