1

次のように、タップイベントをテキストフィールドに追加できます。

{
    xtype         : 'textfield',
    name          : 'GIVEN_NAME',
    label         : 'Given Name',
    disabled: false,
    listeners : {
        element : 'element',
        tap : function() {
            console.log('tap');
        }
    }
}

そしてそれは動作します。しかし、これはコントローラーで使用すると機能しません。

control: {
    givenName: {
        element : 'element',
        tap: 'onGivenNameTap'
    }
}

なんで？テキストフィールドでタップイベントを機能させるにはどうすればよいですか?

4

3 に答える 3

1

デフォルトでは、コントローラーは要素イベントをリッスンできません: https://www.sencha.com/forum/showthread.php?251844s&p=922908&viewfull=1#post922908

ただし、独自のカスタム イベントを TextField コンポーネントに追加できます: https://fiddle.sencha.com/#fiddle/rio

Ext.define('Fiddle.field.Text', {
    override: 'Ext.field.Text',

    initialize: function() {
        this.callParent();

        this.on('painted', function() {
            var cmp = this;

            cmp.element.on('tap', function() {
                cmp.fireEvent('elementtap', cmp, cmp.element);
            });
        });
    }
});

Ext.define('Fiddle.controller.Main', {
    extend: 'Ext.app.Controller',

    config: {
        refs: {
            givenName: 'textfield[name="givenName"]'
        },
        control: {
            givenName: {
                elementtap: 'onGivenNameTap'
            }
        }
    },

    onGivenNameTap: function() {
        Ext.Msg.alert('Tap!');    
    }
});

Ext.application({
    name : 'Fiddle',
    controllers: ['Fiddle.controller.Main'],

    launch : function() {
        Ext.create('Ext.Panel', {
            fullscreen: true,
            items: [{
                xtype         : 'textfield',
                name          : 'givenName',
                label         : 'Given Name',
                disabled: false
            }]
        });
    }
});
于 2015-08-04T05:59:58.443 に答える
1

これを試して：

煎茶フィドル

あなたの見解では：

Ext.define('MyApp.view.my_view', {
    extend: 'Ext.Panel',

    config: {
        layout: 'fit',
        items: [
            {
                xtype: 'textfield',
                itemId: 'my_text_field',
                label: 'My Label',
                listeners: [
                    {
                        element: 'element',
                        event: 'tap',
                        fn: function () {
                            this.fireEvent('tap', this);
                        }
                    }
                ]
            }
        ]
    }
});

コントローラーで:

  Ext.define('MyApp.controller.my_controller', {
        extend: 'Ext.app.Controller',

        requires: [
            'MyApp.view.my_view'
        ],

        config: {
            control: {
                'textfield[itemId=my_text_field]': {
                    tap: 'onMyTextFieldTap'
                }
            }
        },

        onMyTextFieldTap: function () {
            alert('tap');
        }
    });

tapテキストフィールドがタップされたときにビューから手動でイベントを発生させており、コントローラーはそれをリッスンしており、onMyTextFieldTap発生時に実行されます。

于 2015-08-04T15:39:01.967 に答える
0

ExtJs のバックグラウンドを持っているように見えますか? タッチでは、他の方法を行う必要があります。

Ext.define('MyApp.Controller, {
    extend: 'Ext.app.Controller',
    config: {
        refs: {
             givenNameCt: 'textfield[name=GIVEN_NAME]'
        },
        control: {
            givenNameCt: {
                tap: 'onGivenNameTap'
            }
        }
    }
    ...
    onGivenNameTap: function(ct) {
        console.log('onGivenNameTap happens...', arguments);
    }
});
于 2015-07-30T21:01:55.577 に答える