天天看點

實用ExtJS教程100例-005:自定義對話框Ext.MessageBox.show

我們對extjs對話框進行了三篇示範:

<a href="http://www.qeefee.com/article/extjs-100-examples-002-messagebox">messagebox的三種用法</a>

<a href="http://www.qeefee.com/article/extjs-100-examples-003-messagebox-with-progressbar">進度條對話框ext.messagebox.progress</a>

<a href="http://www.qeefee.com/article/extjs-100-example-messagebox-wait">等待對話框ext.messagebox.wait</a>

通過上面三篇内容的示範,相信你已經基本上了解了extjs的基本樣式,這篇文章将示範如何使用自定義extjs對話框。

要顯示自定義的對話框,我們需要用到ext.messagebox.show方法。先來看一個簡單的例子:

看到了吧,ext.messagebox.show方法的參數是一個配置對象,配置中有title、msg、width、buttons等配置項,用來決定對話框的顯示内容。

這些配置項的說明如下:

title:标題

msg:内容

width:對話框視窗的寬度

buttons:對話框底部顯示的按鈕,它可以是下面的枚舉值:

ext.messagebox.ok

ext.messagebox.yes

ext.messagebox.no

ext.messagebox.cancel

或者可以是一些按鈕組合:

ext.messagebox.okcancel

ext.messagebox.yesno

ext.messagebox.yesnocancel

multiline:為true的時候顯示一個多行的輸入框,預設為false

fn:回調函數,它接收三個參數:

buttonid:使用者點選的按鈕的id,如果是ok按,就是小寫的ok。由于有四種按鈕,是以它的值可以是:ok、no、yes、cancel

text:在有文本框的對話框中,text為使用者輸入的值

opt:傳遞給show方法的配置項

animatetarget:顯示打開/關閉動畫時候的目标元素,可以是元素id或ext.dom.element對象

icon:對話框中顯示的圖示,它的可用項有:

ext.messagebox.info

ext.messagebox.warning

ext.messagebox.question

ext.messagebox.error

實用ExtJS教程100例-005:自定義對話框Ext.MessageBox.show

我們可以使用自定義對話框顯示之前所有的效果。

如果認為此文對您有幫助,别忘了支援一下哦!

聲明:本部落格原創文字隻代表本人工作中在某一時間内總結的觀點或結論,與本人所在機關沒有直接利益關系。非商業,未授權,貼子請以現狀保留,轉載時必須保留此段聲明,且在文章頁面明顯位置給出原文連接配接。

轉載:http://www.cnblogs.com/youring2/p/extjs-100-examples-005-custom-messagebox.html

繼續閱讀