`
raymond.chen
  • 浏览: 1445786 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

Ext.MessageBox的使用

阅读更多

Ext.MessageBox是一个工具类,它继承自Object对象,用来生成各种风格的信息提示对话框,Ext.Msg是该类的别名,使用Ext.MessageBox和使用Ext.Msg有相同的效果,而后者提供了更简短的调用方式。

 

1、Ext.MessageBox.alert()
      调用格式:Ext.MessageBox.alert(String title, String msg, [Function fn], [Object scope])
      参数说明:
            title:提示框的标题。
            msg:显示的提示信息。
            fn:回调函数。可选
            scope:回调函数的作用域。可选
      范例:

Ext.MessageBox.alert("提示", "信息提示对话框!", function(id){
	alert(id); //按钮ID传递到回调函数中,值为ok、cancel
});

 

2、Ext.MessageBox.confirm()

            调用格式:Ext.MessageBox.confirm(String title, String msg, [Function fn], [Object scope])
            参数说明:同Ext.MessageBox.alert()

            范例:

Ext.Msg.confirm("提示", "是否要删除?", function(id){
	alert(id); //按钮ID传递到回调函数中,值为yes、no
});

 

3、Ext.MessageBox.prompt()

            调用格式:Ext.MessageBox.prompt(String title, String msg, [Function fn], [Object scope],             [Boolean/Number multiline])
             参数说明:
                        前4项参数同Ext.MessageBox.alert()
                        [Boolean/Number multiline]:是否显示为多行文本框。或者以像素为单位直接设置文本域的高度。默认为false。
            范例:

Ext.Msg.prompt("提示", "请输入密码:", function(id, msg){
	alert(id + "_" + msg); //按钮ID传递到回调函数中,值为ok、cancel
}, this, true);

 

4、Ext.MessageBox.wait()
            调用格式:Ext.MessageBox.wait(String msg, [String title], [Object config])
            参数说明:
                        msg:显示的提示信息。
                        [String title]:提示框的标题。可选
                        [Object config]:用于配置进度条的配置对象。可选  
            范例:

Ext.Msg.wait("请耐心等待...", "提示", {
	text: "进度条上的文字"
});

 

5、Ext.MessageBox.show()
            调用格式:Ext.MessageBox.show(Object config)
            参数说明:一个包含提示框配置信息的配置对象。
            常用配置项:
                        title:提示框的标题
                        msg:显示的信息内容
                        buttons:一个包含配置信息的json对象或false不显示任何按钮,默认为false
                              可选值:
                                    Ext.Msg.CANCEL
                                    Ext.Msg.OK
                                    Ext.Msg.OKCANCEL
                                    Ext.Msg.YESNO
                                    Ext.Msg.YESNOCANCEL
                        icon:样式文件
                              可选值:
                                    Ext.Msg.ERROR
                                    Ext.Msg.INFO
                                    Ext.Msg.QUESTION
                                    Ext.Msg.WARNING
                        fn:回调函数
                        width:对话框宽度,以像素为单位
                        minWidth:最小宽度
                        maxWidth:最大宽度
                        closable:是否显示右上角的关闭按钮,默认为true
                        modal:是否为模式窗口,默认为true
                        progress:是否显示一个进度条,默认为false,该进度条需要由程序控制滚动
                        progressText:进度条上显示的文字
                        wait:是否显示一个自动滚动的进度条,默认为false
                        prompt:是否显示一个单行文本域,默认为false
                        value:如果prompt为true,则value值将显示在文本域中
                        multiline:如果prompt为true,则是否显示多行文本域
            范例:

//改变默认的按钮文字
//必须放在创建提示框之前
/*
Ext.Msg.buttonText={
	yes: "是",
	no: "否",
	ok: "确定",
	cancel: "取消"
};
*/

Ext.Msg.buttonText.yes = "是";
Ext.Msg.buttonText.no = "否";

var obj = Ext.Msg.show({
	title: "提示",
	msg: "确定要删除吗?",
	buttons: Ext.Msg.YESNO,
	icon: Ext.Msg.QUESTION,
	fn: function(id, msg){
		alert(id + "_" + msg);
	}
});

 

6、动态更新提示框

            1)更新提示文字:

                        调用格式:updateText([String text])
                        范例:

var obj = Ext.Msg.show({
	title: "提示",
	msg: "当前时间:",
	icon: Ext.Msg.INFO,
	width: 200
});

//任务管理器
Ext.TaskMgr.start({
	run: function(){
		//alert(arguments[0]); //获取参数值
		obj.updateText(new Date().format("Y-m-d G:i:s"));
	},
	interval: 1000,
	args: ["111", "222"]
});

 

2)更新进度条及提示信息:

            调用格式:updateProgress(Number value, String progressText, String msg)
            参数说明:
                  value:0~1之间的数字,默认为0。
                  progressText:进度条上显示的文字。
                  msg:显示的信息内容。
            范例:

var obj = Ext.Msg.show({
	title: "提示",
	msg: "当前时间:",
	width: 200,
	progress: true
});

var count = 0; //刷新次数
var per = 0; //进度百分比
var progressText = ""; //进度条信息
var msg = ""; //显示的信息内容

//任务管理器
Ext.TaskMgr.start({
	run: function(){
		count++;
		if(count>10){
			obj.hide(); //隐藏对话框
			Ext.TaskMgr.stop(this); //停止任务
			count = 0;
		}
		per = count/10;
		progressText = "当前完成了" + per*100 + "%";
		msg = "当前时间:" + new Date().format("Y-m-d G:i:s");
		obj.updateProgress(per, progressText, msg);
	},
	interval: 1000
});

 

分享到:
评论

相关推荐

    Ext_MessageBox

    `Ext.MessageBox.alert`函数用于显示一个简单的警告对话框,通常用于向用户传递一条信息或通知。 **示例代码:** ```javascript Ext.MessageBox.alert("hello", "nihaoa!"); ``` 该示例展示了如何通过`alert`方法来...

    Extjs Ext.MessageBox.confirm 确认对话框详解

    Ext.MessageBox.confirm()详解 显示一个确认对话框,用来代替JavaScript标准的confirm()方法,具有两个按钮“是”和“否”如果为其提供一个回调函数,则该函数将在单击按钮后被调用(包括右上角的...

    ExtJS Ext.MessageBox.alert()弹出对话框详解

    代码如下: Ext.onReady(function() { Ext.Msg.alert(‘提示’, ‘逗号分隔参数列表’); //这种方式非常常见的 ...接下来认识一下Ext.MessageBox Ext.MessageBox是一个工具类,他继承自Obiect对象,用来生成各种

    Ext--MessageBox教程

    在上述代码中,`buttons: Ext.MessageBox.INFO`表示对话框显示的是一个信息图标,`fn`参数是回调函数,当用户点击按钮时执行。`buttonId`会返回用户点击的按钮标识,如'ok'(确定)、'yes'(是)或'no'(否)。 `...

    Ext messageBox hide 小应用

    在描述中提到的博文链接,虽然具体内容无法直接提供(因为链接未直接提供详细信息),但通常这类博客会包含如何使用`Ext.messageBox`和`hide`方法的实际代码示例,以及可能遇到的问题和解决方案。博主可能会分享如何...

    Ext.MessageBox工具类简介

    案例如下: 代码如下: Ext.onReady(function(){ Ext.MessageBox.alert(“提示”,”请单击我,确定”,callBack); function callBack(id){ alert(“单击的按钮ID是:”+id); } Ext.MessageBox....

    Ext.Array例子

    2. **确认对话框**:`Ext.MessageBox.confirm(title, message, callback, scope)` 显示一个确认对话框,用户点击确定或取消后执行回调函数 3. **信息消息**:`Ext.MessageBox.info(message)` 显示信息对话框 4. **...

    ext学习资料,ext js开发前台页面

    使用`Ext.MessageBox.show()`创建一个带有进度条的对话框,需要确保`progress`为`true`,并可以调用`Ext.MessageBox.hide()`来隐藏对话框,或者使用`updateProgress()`方法更新进度条的状态,传入当前进度值、...

    extjs弹出框 n秒后消失

    icon: Ext.MessageBox.INFO, // 可选值有 Ext.MessageBox.INFO, Ext.MessageBox.WARNING, ExtMessageBox.QUESTION, Ext.MessageBox.ERROR buttons: Ext.MessageBox.CLOSE, // 默认按钮,也可以自定义为其他组合,...

    extjs脚本开发详解

    `Ext.MessageBox.alert()`用于显示一个简单的警告对话框,包含一个确定按钮。它接受三个参数:`title`(对话框标题),`msg`(显示的消息)和一个可选的回调函数,该函数在用户点击确定按钮后执行。例如: ```...

    ExtJs的Ext.Ajax.request实现waitMsg等待提示效果

    在进行Ajax请求之前,我们可以使用Ext.MessageBox确认框来询问用户是否要进行操作,并在用户确认后显示一个加载遮罩(LoadMask)。 接下来,我们通过Ext.LoadMask组件来实现加载提示。Ext.LoadMask可以对指定的DOM...

    非常有用的EXT学习总结

    1. `Ext.MessageBox.alert()`方法: 这个方法用于显示一个简单的警告对话框,包含一个确定按钮。它接受三个参数:标题(title)、消息内容(msg)和一个可选的回调函数(function)。当用户点击确定按钮后,回调...

    一个相当不错的extjs入门文档,整个ext的控件,上边很多实例。有助于新手学习。

    `EXT.MessageBox.alert()` 方法用于创建一个简单的警告对话框,包含一个标题、一条消息和一个可选的回调函数。标题和消息是必需的参数,回调函数会在用户点击对话框的确定按钮后执行。例如: ```javascript Ext....

    Extjs2.0的入门

    `Ext.MessageBox.alert()`方法用于显示一个简单的警告对话框,包含一个确定按钮。它有三个参数:`title`(对话框标题)、`msg`(显示的消息)和一个可选的回调函数,该函数在用户点击确定按钮后执行。例如: ```...

    Ext入门学习实例教程其中包含实例

    为了展示进度条的使用,我们需要了解 `Ext.MessageBox.show()` 和其他两个方法:`Ext.MessageBox.hide()` 和 `Ext.MessageBox.updateProgress(value, "ProgressText", "msg")`。 - **Ext.MessageBox.hide()**:用于...

    ext 教材 ext js 教程

    1. `Ext.MessageBox.alert()` `alert()` 方法用于显示一个简单的警告对话框,包含一个标题、消息和一个确定按钮。两个必选参数是 `title` 和 `msg`,分别表示对话框的标题和显示的消息。可选参数是一个回调函数,当...

    learning ext js 中文版之在对话框中添加图标和按钮事件

    EXT JS提供了多种预设图标,例如`Ext.MessageBox.INFO`、`Ext.MessageBox.WARNING`、`Ext.MessageBox.ERROR`等,也可以使用自定义的CSS类来设置特定的图标。 按钮和按钮事件的处理是EXT JS中对话框功能的重要部分。...

    ExtJs控件详解

    与`alert()`类似,`Ext.MessageBox.confirm()` 方法用于弹出一个确认对话框,询问用户是否同意某个操作。同样,它也接受三个参数,其中第三个参数`fn`在用户点击按钮后被调用,并接收一个参数`e`,表示用户的选择...

    ExtJs2指南最新版

    1. **Ext.MessageBox.alert()方法**: 这个方法用于显示一个简单的警告对话框,包含一个确定按钮。它接受三个参数:标题、消息和一个可选的回调函数。标题和消息是必需的,回调函数会在用户点击确定按钮后执行。...

Global site tag (gtag.js) - Google Analytics