2

フォームがあり、buttonそれを送信する があります。「登録」ボタンをタップするだけで送信が実行されることを望みます。しかし、ユーザーが任意のテキストを入力してtextfield「Go」（別名「Enter」）ボタンを押すと。フォームが送信され、私はそれについて何もできません。

この動作は、Android v2.3.6 のSamsung Galaxy S (GT i9000) で確認されています。しかし、Android 4 を搭載したHTCは思い通りに動作します。

submitOnAction:false役に立ちません 。beforesubmitそれも。コード リストの解決策はどれも機能しません。

「登録」ボタンを押す以外の方法でフォームを送信したくないだけです。

ファイル/view/userRegistration/FormPanel.js

Ext.define('My.view.userRegistration.FormPanel', {
    extend: 'My.view.components.FormPanel',
    xtype : 'userRegistrationForm',

    config: {
        standardSubmit : false,
        submitOnAction : false,

        listeners: {
            beforesubmit: function(form, values, options, eOpts){
                console.log('before submit fired');
                return false; // returning false doesn't help
            },
            '> field': {
                keyup: function(fld, e){
                    //13 = user tapped 'return' button on keyboard
                    //10 = user tapped 'hide keyboard' on keyboard
                    if (e.browserEvent.keyCode == 13 || e.browserEvent.keyCode == 10) {
                        e.stopEvent();
                        fld.element.dom.blur();
                    }
                }
            }
        },

        items : [
            {
                xtype: 'textfield',
                name : 'firstName',
                required: true,
                listeners: {
                    action: function(field, e, eOpts) {
                    e.stopEvent();
                    return false;
                    },
                    keyup: function(field, e) {
                        if (e.browserEvent.keyCode == 13 || e.browserEvent.keyCode == 10) {
                            // GO pressed on "firstName"
                            e.stopEvent();
                            field.element.dom.blur();
                            return false;
                        }
                    }
                }
            },
            {
                xtype: 'button',
                text : 'Register',
                listeners: {
                    tap: function(button) {
                        var form = button.parent;
                        if (form.isValid()) {
                            form.onSubmit();
                        }
                    }
                }
            }
        ]
    }
});

ファイル/view/components/FormPanel.js

Ext.define('My.view.components.FormPanel', {
    extend : 'Ext.form.Panel',

    onSubmit: function() {
        var fieldValues = this.getValues();
        // Sending fieldValues via AJAX
    },
    isValid: function(args) {
        // Validating values
    }
});
4

6 に答える 6

2

そのために FormPanel をオーバーライドする必要はありません。コントローラーでは、フィールドからアクションを実行してバブルアップするのを防ぐことができます。

Ext.define('TestApp.controller.Login', {
    extend: 'Ext.app.Controller',
    config: {
        control: {
            'field': {
                action: 'onFieldAction'
            }
        }
    },
    onFieldAction: function(field, e) {
        // Stop event here 
        e.stopEvent();
        e.stopPropagation();
    }
});

これを行っているときに遭遇した落とし穴があります。FormPanel のデフォルトの初期化関数を誤って上書きしてしまいました。こうなると何事もうまくいかない

Ext.define('TestApp.view.Login', {
    extend: 'Ext.form.Panel',
    xtype: 'loginform',
    config: {
        ...
    }
    initialize: function(config) {
         this.callParent(arguments); // Nothing will work without this line
         ...
    }
});
于 2013-07-24T04:00:02.747 に答える
2

問題はonSubmit()方法にありました。sencha -touch-all-debug.js にあり@privateます:

Ext.define('Ext.form.Panel', {

    // @private
    onSubmit: function(e) {
        var me = this;
        if (e && !me.getStandardSubmit()) {
            e.stopEvent();
        } else {
            this.submit();
        }
    }

}

onSubmit()したがって、子クラスでオーバーライドすることは絶対に間違っています。より正しい方法。

ファイル/view/components/FormPanel.js

Ext.define('My.view.components.FormPanel', {
    extend : 'Ext.form.Panel',

    config: {
        standardSubmit: false,

        listeners: {
            beforesubmit: function(form, values, options, eOpts) {
                // Do something with data. Send it via AJAX, for example
                return false; // returning false to prevent real form.submit();
            }
        }
    }
}

フォームのボタンは を呼び出すだけform.submit();です。

ファイル/view/userRegistration/FormPanel.js

        {
            xtype: 'button',
            text : 'Register',
            handler: function() {
                var form = button.parent;
                if (form.isValid()) {
                    form.submit();
                }
            }
        }
于 2013-01-16T15:12:31.817 に答える
1 
document.addEventListener("keypress", onGoKeyDown, false);
function onGoKeyDown(e) {
    console.log(e);
    if(e.srcElement.localName == 'input') {
        if (e.keyCode === 13 || e.keyCode === 10) {
            e.preventDefault();
        }
    }
}
于 2016-03-10T15:21:03.487 に答える
0

ここで、[送信] ボタンをクリックするか、アクションを入力して、送信時に Ajax メソッドを呼び出したい場合は、

submitOnAction : FormPanel 構成で true

FormPanel の initialize メソッドをオーバーライドする場合に備えて、initialize メソッドに this.callParent(arguments) を追加します。

FormPanel の submit メソッドをオーバーライドして Ajax Call を追加する

Submit ボタンのタップイベントをリッスンして Ajax Call を追加する

于 2016-01-19T09:35:44.927 に答える
0

誰かがまだ解決策を探しているかどうかはわかりませんが、非常に単純なトリックを思いつきました.入力をトラップし、ユーザーが「Go」またはあなた以外のボタン/キーを押してもフォームの送信を防ぎます.欲しいです。これを行うには、すべての入力フィールドにリスナーを配置し、'blur' イベントをリッスンします。これにより、フィールドを離れるときにすべてのアクションがトラップされます (ブラー)。ぼかしリスナー イベント内で、目的の送信または登録ボタンに到達するまで、次のフィールドで focus() を実行します (フォームをタブで移動する、つまり、フィールド 1 にいる場合はフォーカスを 2 に送信するなど)。そこに着いたら、処理や送信などを行うことができます。これは私にとってはうまくいきました!

于 2014-06-26T22:36:20.917 に答える