Sencha ExtJS：如何防止光标在编辑时离开 phone 数字字段中的当前位置？

Question

退格 1 次后，光标自动移动到 phone 号码的末尾，它应该保留在括号中，因为用户可能只想编辑区号。（包含代码和图像...从头开始，没有 10 个代表 post 图片，:/）

这是文本字段的代码（仅按钮；如果需要更多上下文，请告知）

{
    name: 'ContPhone',
    itemId: 'ContPhone',
    fieldLabel: I18N.Messages.STR_PHONE,
    maxLength: 25,
    width: 370,
    labelCls: 'formFieldLabel',
    enforceMaxLength: true,
    plugins: Ext.create('Silver.ux.plugin.FormatPhoneNumber'),
    vtype: 'phone'
},

这是 plugin/extension 信息。我猜 onChange() 函数是罪魁祸首。请指导我解决这个问题的方向。完整的解决方案意味着，如果我在保存之前从字段中删除任何数字，光标位置将保持不变。

Ext.define('Silver.ux.plugin.FormatPhoneNumber', {
    extend: 'Ext.form.TextField',

    init: function (c) {
        // Format a phone number
        Ext.apply(Ext.util.Format, {
            phoneNumber: function (value) {
                var phoneNumber = value.replace(/\./g, '').replace(/-/g, '').replace(/[^0-9]/g, '');
                //US phone numbers
                if (phoneNumber !== '' && phoneNumber.length === 10 && UI_CULTURE === 'en-US') {
                    return '(' + phoneNumber.substr(0, 3) + ') ' + phoneNumber.substr(3, 3) + '-' + phoneNumber.substr(6, 4);
                } else {
                    return value;
                }
            }
        });

        // Validate a phone number
        Ext.apply(Ext.form.VTypes, {
            'phoneText': (UI_CULTURE === 'en-US' ?
                'Not a valid phone number. Must be in the format (555) 555-5555.' :
                'Not a valid phone number. Must be a number 0-9.'),
            'phoneMask': /[\-\+0-9\(\)\s\.Ext]/,
            'phoneRe': (UI_CULTURE === 'en-US' ?
                /^(\({1}[0-9]{3}\){1}\s{1})([0-9]{3}[\-]{1}[0-9]{4})$|^(((\+44)? ?(\(0\))? ?)|(0))( ?[0-9]{3,4}){3}$|^Ext\. [0-9]+$/ :
                /^[0-9\s]+$/),
            'phone': function (v) {
                return this.phoneRe.test(v);
            }
        });

        c.on('change', 'onChange', this);
    },

    onChange: function (c) {
        c.setValue(Ext.util.Format.phoneNumber(c.getValue()));
    }
});

Answer 1

我想通了。问题已通过删除此段得到解决：

onChange:  function (c) {
    c.setValue(Ext.util.Format.phoneNumber(c.getValue()));
}

该字段仍会验证数字，直到它符合格式条件。在匹配之前无法保存。 :D

Sencha ExtJS：如何防止光标在编辑时离开 phone 数字字段中的当前位置？

Sencha ExtJS: How do I prevent the cursor from leaving the current position in a phone number field upon edit?

javascript

extjs

phone-number

textfield

sencha-touch