Question

在一个包含几个文本项和一个按钮的表单中，可以在单击按钮之前知道焦点在哪个项目中？

我想在按钮点击中打开另一个表单，此表单的“上下文”取决于上一个表单的焦点。

有什么想法吗？

修改

我试图在控制器中保存最后一个聚焦元素，绑定所有字段的blur事件，但似乎这个事件在IE中不同步（总是他），Chrome和FF似乎没问题

Ext.define('MyApp.controller.MyController', {
    extend: 'Ext.app.Controller',
    id: 'MyController',
    views: [
        'MyView'
    ],
    init : function(application){
        var me = this;

        me.lastFocus = null;

        me.control({
            '.field' : {
                blur: me.fieldBlur,
                scope: me
            }
        });
    },

    fieldBlur: function(field, event, opts) {
        this.lastFocus = field;
        //console.log('lastFocus: ' + field);
    }

});

Answer 1

我自己从未尝试过，但 Ext.FocusManager.focusedCmp 看起来很有希望。请注意，您需要先激活它，然后才能通过调用 Ext.FocusManager.enable()

来使用它

修改

我认为现在它会更稳定。我很遗憾听到它不能帮助你，但我无法理解为什么focusedCmp应该undefined按时点击它应该是按钮的按钮。由此我发现我的错误，您需要访问previousFocusedCmp。

但它应该起作用，因为它没有什么魔法......

一个小例子 JSFiddle ：

Ext.FocusManager.enable();
Ext.create('Ext.form.Panel', {
    title: 'Simple Form',
    bodyPadding: 5,
    width: 350,

    // The form will submit an AJAX request to this URL when submitted
    url: 'save-form.php',

    // Fields will be arranged vertically, stretched to full width
    layout: 'anchor',
    defaults: {
        anchor: '100%'
    },

    // The fields
    defaultType: 'textfield',
    items: [{
        fieldLabel: 'First Name',
        name: 'first',
        allowBlank: false
    },{
        fieldLabel: 'Last Name',
        name: 'last',
        allowBlank: false
    }],

    // Reset and Submit buttons
    buttons: [{
        text: 'Reset',
        handler: function() {
            console.log('Most likely the button you clicked: ', Ext.FocusManager.focusedCmp, 'The Component that was focused before:  ',Ext.FocusManager.previousFocusedCmp );
            this.up('form').getForm().reset();
        }
    }, {
        text: 'Submit',
        formBind: true, //only enabled once the form is valid
        disabled: true,
        handler: function() {
            var form = this.up('form').getForm();
            if (form.isValid()) {
                form.submit({
                    success: function(form, action) {
                       Ext.Msg.alert('Success', action.result.msg);
                    },
                    failure: function(form, action) {
                        Ext.Msg.alert('Failed', action.result.msg);
                    }
                });
            }
        }
    }],
    renderTo: Ext.getBody()
});

FocusManger如何用一句话来做（我们省去了keynav）：

一旦启用它就会查询整个DOM   可聚焦的组件，并告诉他们每个人通知他焦点和模糊   变化。

Answer 2

从用户的角色来看，这听起来有些阴暗，但无论你走到哪里：

在每个表单上使用jQuery mouseover，并将一些全局变量设置为自身或相应的字符串，当调用该按钮时，变量包含最后一个活动字段。

类似

var last_active = 0;
function set_last_active(e, ui){
    last_active = $(this);
}
$('.tracked_form').mouseover(set_last_active);

应该做的伎俩，也看看你是否可以使用event bubbling。

Answer 3

如果您延迟访问我的blur属性，则在表单字段中使用lastFocus事件的提议可在按钮中使用。

onButtonClick : function(button, e, eOpts) {
  var me = this;
  setTimeout(function(){
      alert(me.lastFocus.getItemId());
  }, 250);
}

在点击按钮之前，可以知道保持焦点的字段吗？

3 个答案: