我們對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
我們可以使用自定義對話框顯示之前所有的效果。
如果認為此文對您有幫助,别忘了支援一下哦!
聲明:本部落格原創文字隻代表本人工作中在某一時間内總結的觀點或結論,與本人所在機關沒有直接利益關系。非商業,未授權,貼子請以現狀保留,轉載時必須保留此段聲明,且在文章頁面明顯位置給出原文連接配接。
轉載:http://www.cnblogs.com/youring2/p/extjs-100-examples-005-custom-messagebox.html