За..бал ExtJS 3, перехожу на ExtJS4!

121 views
Skip to first unread message

DanilG

unread,
Dec 17, 2011, 8:31:58 AM12/17/11
to ruextjs
Занимаюсь extJS в итоге уже второй год, работаю все на на extJS 3
(последняя 3.4.0).
За..ла именно кривизна лэйаутов. Как ни крути, глючит следующий пример
в IE, а лезть в код и править механизм css и лэйаутов совсем не
хочется.

В примереу меня окно, в ней панель формы с полем и еще одной вложенной
панелью с полем.
Высоту окна я задаю чтобы подгонялась под содержимое (layout='auto').
Так надо, содержимое (состав полей) может меняться.

Попробуйте сузить окно по ширине, поля расползутся в IE. Глючит именно
потому, что есть вложенная панель. Так же, в FireFox окно получается
схлопнутым, если в панели формы предусмотреть тулбар (но это уже
другая беда).

MyWindowUi = Ext.extend(Ext.Window, {
width: 400,
layout: 'auto',
title: 'My Window',
initComponent: function() {
Ext.applyIf(this, {
items: [
{
xtype: 'form',
title: 'My Form',
items: [
{
xtype: 'textfield',
anchor: '100%',
fieldLabel: 'field1'
},
{
xtype: 'panel',
layout: 'form',
title: 'My Panel',
items: [
{
xtype: 'textfield',
anchor: '100%',
fieldLabel: 'field2'
}
]
}
]
}
]
});

MyWindowUi.superclass.initComponent.call(this);
}
});

var win = new MyWindowUi();
win.show();

В extJS4 к великой моей радости все работает нормально! Собственно,
поэтому решил заняться переходом на 4, чем пытаться залатать дыры под
3.

vladsch

unread,
Dec 17, 2011, 1:09:34 PM12/17/11
to ruextjs
layout: 'auto' совсем не означает подгонку под содержимое. Это
простейший лейаут, когда айтемы рендерется внутрь контейнера и никоим
образом этим контейнером не обрабатываются
В ExtJS 3.4 с лейаутами всё нормально, вы просто не умееете их
готовить

Попробуйте это

MyWindowUi = Ext.extend(Ext.Window, {
width: 400,

layout: 'anchor',
autoHeight: true,


title: 'My Window',
initComponent: function() {
Ext.applyIf(this, {
items: [
{
xtype: 'form',

anchor: "100%",


title: 'My Form',
items: [
{
xtype: 'textfield',
anchor: '100%',
fieldLabel: 'field1'
},
{
xtype: 'panel',
layout: 'form',
title: 'My Panel',
items: [
{
xtype: 'textfield',
anchor: '100%',
fieldLabel: 'field2'
}
]
}
]
}
]
});

MyWindowUi.superclass.initComponent.call(this);
}
});

DanilG

unread,
Dec 18, 2011, 4:13:56 AM12/18/11
to ruextjs
Я был бы счастилив, если меня кто действительно научил. Но идем
дальше, заменим в примере 'textfield', например, на 'datefield' и
получим то о чем я писал выше. Живой пример здесь:
http://platformx.ru/test/extjs/layouts/form3.php (глюки наблюдаются
именно в IE!)
В ExtJS 4 все примеры, повторюсь - работают нормально.

bvh

unread,
Dec 18, 2011, 5:12:07 PM12/18/11
to ruextjs
Да всё очень просто. Испоьзуйте layot: 'fit' да height: 'auto' и будет
вам счастье! Теоретически...


On Dec 18, 11:13 am, DanilG <euro...@mail.ru> wrote:
> Я был бы счастилив, если меня кто действительно научил. Но идем
> дальше, заменим в примере 'textfield', например, на 'datefield' и

> получим то о чем я писал выше. Живой пример здесь:http://platformx.ru/test/extjs/layouts/form3.php(глюки наблюдаются

DanilG

unread,
Dec 19, 2011, 2:27:44 AM12/19/11
to ruextjs
Так-то, теоретически, все мы счастливы!
Пробовал я в разных сочетаниях, но что знаю, стандартное использование
layout='fit' без указания высоты приводит к схлапыванию содержимого
контейнера, а нестандартное тоже не решает багов в IE.

Konstantin Mirin

unread,
Dec 19, 2011, 8:27:05 AM12/19/11
to rue...@googlegroups.com
О©╫ ExtJS 4 О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫. О©╫, О©╫О©╫О©╫О©╫О©╫О©╫, О©╫О©╫О©╫О©╫ 4.1 О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫
О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ layout О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫.
О©╫ О©╫О©╫О©╫ О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ Data Package.
О©╫ О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫ О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫ О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫
О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫. О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫, sdk tools О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ JS, О©╫О©╫О©╫О©╫О©╫О©╫О©╫.
О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫, О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫, О©╫О©╫.... О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫
О©╫уёО©╫О©╫О©╫. О©╫О©╫ О©╫О©╫О©╫О©╫ О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ :)

О©╫О©╫О©╫О©╫ О©╫ О©╫О©╫О©╫О©╫О©╫, О©╫О©╫ О©╫О©╫О©╫О©╫О©╫, О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫ О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫, О©╫О©╫О©╫ О©╫ 3О©╫
О©╫О©╫О©╫О©╫О©╫О©╫.

On 12/19/2011 09:27 AM, DanilG wrote:
> О©╫О©╫О©╫-О©╫О©╫, О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫, О©╫О©╫О©╫ О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫!
> О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫ О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫, О©╫О©╫ О©╫О©╫О©╫ О©╫О©╫О©╫О©╫, О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫
> layout='fit' О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫
> О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫, О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫ О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫ О©╫ IE.
>
>
> On 19 О©╫О©╫О©╫, 01:12, bvh<bvh....@gmail.com> wrote:
>> О©╫О©╫ О©╫сё О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫. О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ layot: 'fit' О©╫О©╫ height: 'auto' О©╫ О©╫О©╫О©╫О©╫О©╫
>> О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫! О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫...


>>
>> On Dec 18, 11:13 am, DanilG<euro...@mail.ru> wrote:
>>
>>
>>
>>
>>
>>
>>

>>> О©╫ О©╫О©╫О©╫ О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫, О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫ О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫. О©╫О©╫ О©╫О©╫О©╫О©╫
>>> О©╫О©╫О©╫О©╫О©╫О©╫, О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫ 'textfield', О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫, О©╫О©╫ 'datefield' О©╫
>>> О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫ О©╫ О©╫О©╫О©╫ О©╫ О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫. О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫:http://platformx.ru/test/extjs/layouts/form3.php(О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫
>>> О©╫О©╫О©╫О©╫О©╫О©╫ О©╫ IE!)
>>> О©╫ ExtJS 4 О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫, О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ - О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫.
>>> On 17 О©╫О©╫О©╫, 22:09, vladsch<vscheg...@gmail.com> wrote:
>>>> layout: 'auto' О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫. О©╫О©╫О©╫
>>>> О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫, О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫ О©╫О©╫О©╫О©╫О©╫О©╫
>>>> О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫
>>>> О©╫ ExtJS 3.4 О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫сё О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫, О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫
>>>> О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫
>>>> О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫

>>>> On 17 О©╫О©╫О©╫, 17:31, DanilG<euro...@mail.ru> wrote:
>>>>> О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ extJS О©╫ О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫, О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫ О©╫О©╫ О©╫О©╫ extJS 3
>>>>> (О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ 3.4.0).
>>>>> О©╫О©╫..О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫. О©╫О©╫О©╫ О©╫О©╫ О©╫О©╫О©╫О©╫О©╫, О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫
>>>>> О©╫ IE, О©╫ О©╫О©╫О©╫О©╫О©╫ О©╫ О©╫О©╫О©╫ О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ css О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫
>>>>> О©╫О©╫О©╫О©╫О©╫О©╫О©╫.
>>>>> О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫, О©╫ О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫ О©╫ О©╫О©╫О©╫О©╫О©╫ О©╫ О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫
>>>>> О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫ О©╫О©╫О©╫О©╫О©╫.
>>>>> О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫ О©╫ О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ (layout='auto').
>>>>> О©╫О©╫О©╫ О©╫О©╫О©╫О©╫, О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ (О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫) О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫.
>>>>> О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫ О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫, О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫ IE. О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫
>>>>> О©╫О©╫О©╫О©╫О©╫О©╫, О©╫О©╫О©╫ О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫. О©╫О©╫О©╫ О©╫О©╫, О©╫ FireFox О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫
>>>>> О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫, О©╫О©╫О©╫О©╫ О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫ (О©╫О©╫ О©╫О©╫О©╫ О©╫О©╫О©╫
>>>>> О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫).

>>>>> О©╫ extJS4 О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫! О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫,
>>>>> О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫ 4, О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫О©╫О©╫О©╫О©╫ О©╫О©╫О©╫О©╫ О©╫О©╫О©╫
>>>>> 3.

--
Best regards,
Konstantin Mirin.

mailto:konstant...@gmail.com
My blog: http://programmersnotes.info/

DanilG

unread,
Dec 19, 2011, 11:23:05 AM12/19/11
to ruextjs
Я азбуку морзе не понимаю %)
Это что, сам гугл еще налажал? Ну, пи..ц!!... приехали :-D

On 19 дек, 16:27, Konstantin Mirin <konstantin.mi...@gmail.com> wrote:
> ExtJS 4 . , , 4.1
> layout .
> Data Package.
> . , sdk tools JS, .
> , , ....
> գ . :)
>
> , , , 3


> .
>
> On 12/19/2011 09:27 AM, DanilG wrote:
>
>
>
>
>
>
>
>
>

> > - , , !
> > , ,
> > layout='fit'
> > ,   IE.
>
> > On 19 , 01:12, bvh<bvh....@gmail.com>  wrote:
> >> ӣ . layot: 'fit' height: 'auto'
> >> ! ...


>
> >> On Dec 18, 11:13 am, DanilG<euro...@mail.ru>  wrote:
>

> >>> , .
> >>> , 'textfield', , 'datefield'
> >>> . :http://platformx.ru/test/extjs/layouts/form3.php(
> >>> IE!)
> >>> ExtJS 4 , - .
> >>> On 17 , 22:09, vladsch<vscheg...@gmail.com>  wrote:
> >>>> layout: 'auto' .
> >>>> ,
> >>>>
> >>>> ExtJS 3.4 ӣ ,

> >>>> On 17 , 17:31, DanilG<euro...@mail.ru>  wrote:
> >>>>> extJS , extJS 3
> >>>>> ( 3.4.0).
> >>>>> .. . ,
> >>>>> IE, css
> >>>>> .
> >>>>> ,
> >>>>> .
> >>>>> (layout='auto').
> >>>>> , ( ) .
> >>>>> , IE.
> >>>>> , . , FireFox
> >>>>> , (

> >>>>> extJS4 ! ,
> >>>>> 4,


> >>>>> 3.
>
> --
> Best regards,
> Konstantin Mirin.
>

> mailto:konstantin.mi...@gmail.com
> My blog:http://programmersnotes.info/

Александр Лозовюк

unread,
Dec 19, 2011, 1:47:31 PM12/19/11
to rue...@googlegroups.com


19 декабря 2011 г. 18:23 пользователь DanilG <eur...@mail.ru> написал:

Я азбуку морзе не понимаю %)
Это что, сам гугл еще налажал? Ну, пи..ц!!... приехали :-D



Странно у меня все ок :)
 
--
C уважением, Александр Лозовюк
Alpha-Beta-Release Blog
http://abrdev.com
Reply all
Reply to author
Forward
0 new messages