title: How to programmatically focus into next input element after typing a single character in ios mobile using angular 1?
body: <p>I have several input fields like below.</p>
  
  <pre><code>&lt;input type='text' autocapitalize='off' ng-keypress='validateAnswer($event)' id='single_char_box_1'  class='form-control' ng-model='charValues[0]' size='1' maxlength='1'  /&gt;
  &lt;input type='text' autocapitalize='off' ng-keypress='validateAnswer($event)' id='single_char_box_2'  class='form-control' ng-model='charValues[1]' size='1' maxlength='1'  /&gt;
  &lt;input type='text' autocapitalize='off' ng-keypress='validateAnswer($event)' id='single_char_box_3'  class='form-control' ng-model='charValues[2]' size='1' maxlength='1'  /&gt;
  </code></pre>
  
  <p>In my controller I have the following code:</p>
  
  <pre><code>$scope.validateAnswer = function($event){
              var regex = new RegExp("[a-z]|[A-Z]|[0-9]");
  
              var key = String.fromCharCode(!$event.charCode ? $event.which : $event.charCode);
  
              if (!regex.test(key)) {
                 $event.preventDefault();
                 return false;
              }else{
  
                  var next_element = document.getElementById($event.target.attributes.autoTabTo.nodeValue);
  
                  if (next_element) {
  
                      next_element.focus();
  
                  }
  
  
              }
          };
  </code></pre>
  
  <p>Above code works fine in the web browser, but in the <strong>Ipad</strong>(chrome browser) it behaves differently. It jumps to the second input when you type a character in the <strong>first input</strong>. It doesn't display any character in the <strong>first input</strong>.</p>