ons-alert-dialog

現在のスクリーンにアラートダイアログを表示します。

使い方 #

<script>
  ons.ready(function() {
    ons.createAlertDialog('alert.html').then(function(alertDialog) {
      alertDialog.show();
    });
  });
</script>

<script type="text/ons-template" id="alert.html">
  <ons-alert-dialog animation="default" cancelable>
    <div class="alert-dialog-title">Warning!</div>
    <div class="alert-dialog-content">
      An error has occurred!
    </div>
    <div class="alert-dialog-footer">
      <button class="alert-dialog-button">OK</button>
    </div>
  </ons-alert-dialog>
</script>

実例 #

See the Pen Alert, confirm and prompt dialogs by Onsen & Monaca (@onsen) on CodePen.

関連情報 #

属性 #

名前 型 / デフォルト値 概要
var String このアラートダイアログを参照するための名前を指定します。 Optional
modifier String ダイアログの見た目を指定します。 Optional
cancelable この属性があると、ダイアログが表示された時に、背景やバックボタンをタップした時にダイアログを閉じます。 Optional
disabled この属性がある時、アラートダイアログはdisabled状態になります。 Optional
animation String
default
ダイアログを表示する際のアニメーション名を指定します。デフォルトでは"none"か"default"が指定できます。 Optional
mask-color String
rgba(0, 0, 0, 0.2)
背景のマスクの色を指定します。"rgba(0, 0, 0, 0.2)"がデフォルト値です。 Optional
ons-preshow Expression "preshow"イベントが発火された時の挙動を独自に指定できます。 Optional
ons-prehide Expression "prehide"イベントが発火された時の挙動を独自に指定できます。 Optional
ons-postshow Expression "postshow"イベントが発火された時の挙動を独自に指定できます。 Optional
ons-posthide Expression "posthide"イベントが発火された時の挙動を独自に指定できます。 Optional
ons-destroy Expression "destroy"イベントが発火された時の挙動を独自に指定できます。 Optional

プリセットのmodifier #

Modifier名 概要
android Androidライクなスタイルを表示します。

メソッド概要 #

シグネチャ 概要
show([options]) ダイアログを表示します。
hide([options]) ダイアログを閉じます。
isShown() ダイアログが表示されているかどうかを返します。
destroy() ダイアログを破棄して、DOMツリーから取り除きます。
setCancelable(cancelable) アラートダイアログを表示した際に、ユーザがそのダイアログをキャンセルできるかどうかを指定します。
isCancelable() このアラートダイアログがキャンセル可能かどうかを返します。
setDisabled(disabled) このアラートダイアログをdisabled状態にするかどうかを設定します。
isDisabled() このアラートダイアログがdisabled状態かどうかを返します。
on(eventName, listener) イベントリスナーを追加します。
once(eventName, listener) 一度だけ呼び出されるイベントリスナーを追加します。
off(eventName, [listener]) イベントリスナーを削除します。もしlistenerパラメータが指定されなかった場合、そのイベントのリスナーが全て削除されます。

イベント概要 #

名前 概要
preshow アラートダイアログが表示される直前に発火します。
postshow アラートダイアログが表示された直後に発火します。
prehide アラートダイアログが隠れる直前に発火します。
posthide アラートダイアログが隠れた後に発火します。

メソッド

show([options]) #

ダイアログを表示します。

パラメーター
名前 概要
options Object オプションを指定するオブジェクトです。
options.animation String アニメーション名を指定します。指定できるのは、"fade", "slide", "none"のいずれかです。
options.callback Function ダイアログが表示され終わった時に呼び出されるコールバックを指定します。

hide([options]) #

ダイアログを閉じます。

パラメーター
名前 概要
options Object オプションを指定するオブジェクト。
options.animation String アニメーション名を指定します。"fade", "slide", "none"のいずれかを指定します。
options.callback Function このダイアログが閉じた時に呼び出されるコールバックを指定します。

isShown(): Boolean #

ダイアログが表示されているかどうかを返します。

返り値: ダイアログが表示されていればtrueを返します。

destroy() #

ダイアログを破棄して、DOMツリーから取り除きます。

setCancelable(cancelable) #

アラートダイアログを表示した際に、ユーザがそのダイアログをキャンセルできるかどうかを指定します。

パラメーター
名前 概要
cancelable Boolean キャンセルできるかどうかを真偽値で指定します。

isCancelable(): Boolean #

このアラートダイアログがキャンセル可能かどうかを返します。

返り値: キャンセル可能であればtrueを返します。

setDisabled(disabled) #

このアラートダイアログをdisabled状態にするかどうかを設定します。

パラメーター
名前 概要
disabled Boolean disabled状態にするかどうかを真偽値で指定します。

isDisabled(): Boolean #

このアラートダイアログがdisabled状態かどうかを返します。

返り値: disabled状態であればtrueを返します。

on(eventName, listener) #

イベントリスナーを追加します。

パラメーター
名前 概要
eventName String イベント名を指定します。
listener Function イベントが発火された際に呼び出されるコールバックを指定します。

once(eventName, listener) #

一度だけ呼び出されるイベントリスナーを追加します。

パラメーター
名前 概要
eventName String イベント名を指定します。
listener Function イベントが発火した際に呼び出されるコールバックを指定します。

off(eventName, [listener]) #

イベントリスナーを削除します。もしlistenerパラメータが指定されなかった場合、そのイベントのリスナーが全て削除されます。

パラメーター
名前 概要
eventName String イベント名を指定します。
listener Function 削除するイベントリスナーの関数オブジェクトを渡します。

イベント

preshow #

アラートダイアログが表示される直前に発火します。

パラメーター
名前 概要
event Object Event object.
event.alertDialog Object アラートダイアログのオブジェクト。
event.cancel Function この関数を実行すると、アラートダイアログの表示を止めます。

postshow #

アラートダイアログが表示された直後に発火します。

パラメーター
名前 概要
event Object Event object.
event.alertDialog Object アラートダイアログのオブジェクト。

prehide #

アラートダイアログが隠れる直前に発火します。

パラメーター
名前 概要
event Object Event object.
event.alertDialog Object アラートダイアログのオブジェクト。
event.cancel Function この関数を実行すると、アラートダイアログが閉じようとするのを止めます。

posthide #

アラートダイアログが隠れた後に発火します。

パラメーター
名前 概要
event Object Event object.
event.alertDialog Object アラートダイアログのオブジェクト。

議論 #