title: Arrow keys blocked by vtype mask extjs
body: <p>I am programming with extjs and am struggling with the interference of vtype mask and the arrow keys.
  I am validating some fields using custom vtypes like:</p>
  
  <pre><code>Ext.define('ldb.util.IbanVtype', {
      override: 'Ext.form.field.VTypes',
  
      // vtype validation function
      vTypeIban: function(value) {
          return this.vTypeIbanRe.test(value);
      },
      // RegExp for the value to be tested against within the validation function
      vTypeIbanRe: /^[A-Z]{2}[0-9]{2}[0-9]{2,30}$/,
      // vtype Text property: The error text to display when the validation function returns false
      vTypeIbanText: 'No valid IBAN',
      // vtype Mask property: The keystroke filter mask
      vTypeIbanMask: /[A-Z0-9]/i
  });
  </code></pre>
  
  <p>which validates an IBAN field. The field is in a column of a grid an has following editor:</p>
  
  <pre><code>editor: {
      xtype: 'textfield',
      allowBlank: false,
      vtype: 'vTypeIban',
  }
  </code></pre>
  
  <p>The validation works fine, but in all validated fields you can't navigate within the string using the arrow keys.</p>
  
  <p>To enable them i had to add %&amp;' to every mask:</p>
  
  <pre><code>vTypeIbanMask: /[A-Z0-9%&amp;']/i
  </code></pre>
  
  <p>Does anybody know how i can enable the arrow keys without allowing unwanted chars in my mask? 
  I couldn't figure out why the mask interacts with the arrow keys. Does anybody know something or has a hint for me?</p>
  
  <p>Many thanks in advance,
  Greetings
  Os</p>