ExtJS: простая форма игнорирует formBind - PullRequest
Новая
       3

ExtJS: простая форма игнорирует formBind

6 голосов
/ 23 июля 2011

У меня крошечная проблема, которая сводит меня с ума на несколько дней.У меня есть панель формы: 

Ext.define('EC.view.PasswordPanel', {
    extend: 'Ext.form.Panel',
    alias: 'widget.pwdpanel',

    bodyPadding: 15,

    initComponent: function() {
        this.initialConfig = {url:'/password/'};

        this.fieldDefaults = {
            labelAlign: 'right',
            labelWidth: 135,
            msgTarget: 'side',
            allowBlank: false,
            inputType: 'password'
        };

        //this.listeners =  {
            //// circumvent broken formBind
            //validitychange: function(comp, valid) {
                //this.down('button').setDisabled(!valid);
            //}};

        this.buttons = [{
            text: 'Change',
            formBind: true,
            scope: this,
            handler: function() {
                this.submit({
                    success: function(form, action) {
                        Ext.Msg.alert(
                            'Success',
                            '<p>Password change has been scheduled successfully.</p>' +
                                EC.DELAY_NOTICE);
                            form.reset();
                    },
                    failure: function(form, action) {
                        if ('result' in action &&
                            'msg' in action.result) {
                            Ext.Msg.alert('Error', action.result.msg);
                        }
                    }
                });
            }
        }];
        this.items = [ {
            xtype: 'textfield',
            name: 'pw_old',
            fieldLabel: 'Old password'
        }, {
            xtype: 'textfield',
            name: 'pw_new1',
            id: 'pw_new1',
            fieldLabel: 'New password',
            minLength: 8,
            maxLength: 16
        }, {
            xtype: 'textfield',
            name: 'pw_new2',
            fieldLabel: 'Confirm new password',
        } ];

        this.callParent(arguments);
    }
});

, для которой я создаю вкладку из TabPanel: 

{
            title: 'Change Password',
            items: { xtype: 'pwdpanel' },
},

Теперь проверка работает отлично, но кнопка «Изменить» не работаетt отключен, пока форма недействительна.Для ясности: когда я нажимаю на него, он не отправляет, но я чувствую, что его следует отключить?

Я делаю что-то явно не так?Другая панель форм во второй вкладке работает просто отлично.

Я могу обойти проблему с помощью прослушивателя, который я закомментировал, но я понимаю, что он должен работать без.

PS Не стесняйтесьуказать на любые глупости / плохой стиль, я совершенно новичок в ExtJS.

Ответы [ 2 ]

5 голосов
/ 23 июля 2011

Это явная ошибка extjs, потому что даже их собственный пример работает так же.

Однако я нашел быстрый обходной путь - добавьте к initComponent строк: 

this.on('afterrender', function(me) {
    delete me.form._boundItems;
});

Вот скрипка .

UPDATE

Ошибка исправлена ​​в 4.0.7.

1 голос
/ 13 октября 2011

Конечно, это ошибка extjs, которую вы можете найти на Ext.form.Basic.getBoundItems. Эта функция изначально инициирует boundItems в виде пустого массива ([]), потому что ее начало запрашивается до отображения полей. Итак, вот исправление этой ошибки. 

//Fix formBind
    Ext.form.Basic.override({
        getBoundItems: function() {
            var boundItems = this._boundItems;
            //here is the fix
            if(this.owner.rendered) {
                if (!boundItems) {
                    boundItems = this._boundItems = Ext.create('Ext.util.MixedCollection');
                    boundItems.addAll(this.owner.query('[formBind]'));
                }
            }
            return boundItems;
        }
    });

Это исправление применяется глобально, поэтому вам не нужно всегда добавлять обработчик 'afterrender' в каждую форму, которую вы создаете. Вот пример использования http://jsfiddle.net/gajahlemu/SY6WC/

...