ons-dialog表示後に、ダイアログ内のons-inputにフォーカスを与えたい

Question

ons-dialog表示後に、ダイアログ内のinputにフォーカスを与えたいのですが、
下記のソースのようにダイアログ表示後のコールバックにforcus()を指定しても
フォーカスがあたりません。
何方かご教授下さい。

====html====

<ons-template id="dialog.html">
  <ons-dialog var="dialog" cancelable>
    <p>
      <ons-input type="text" id="username"></ons-input>
    </p>
    <p>
      <ons-button onclick="dialog.hide()">Sign in</ons-button>
    </p>
  </ons-dialog>
</ons-template>


====js====

function loginButtonClick() {

  ons.createDialog('dialog.html').then(function() {
    
    var options = {
      // アニメーションの設定
      animation: 'slide',
      // 画面遷移後に実行されるコールバック
      callback: function() { 
        // ユーザー名にフォーカスを与える
        $('#username').focus();
      }
    };    
  
    dialog.show(options);
    
  });
};

Answer 1

@yatama さん

iOS の場合、デフォルト設定の Cordova 環境（および Monaca 環境）では、input 要素に対する focus() はセキュリティ上動作しません。
動作させるためには、config.xml で KeyboardDisplayRequiresUserAction を false に設定する必要があります。

英語:

KeyboardDisplayRequiresUserAction(boolean)

Default: true
Set to false to allow the keyboard to appear when calling focus() on form inputs.

https://cordova.apache.org/docs/en/latest/config_ref/

日本語:

KeyboardDisplayRequiresUserAction(boolean)

デフォルト: true
フォームインプットに対して focus() を実行したとき、キーボードを表示することを許可するためには、false を指定してください。

Answer 2

$('#username').focus();

この部分

$('#username .text-input').focus();

でできませんか

Comments

[yatama]

ありがとうございます。
残念ながら現象は変わりませんでした。
PCでのプレビューデバッグではフォーカスがあたりますが、ios端末での実機デバッグではあたりません。
ちなみに「ons.notification.prompt」の「autofocus=true」でも同じ現象となります。

[rururu3]

iOSでのことだったんですね。iOS端末持ってないので、調べれそうにないです。お役に立てなくてすいませんー