Extjs弹出框
来源:互联网 发布:淘宝网手拿包 编辑:程序博客网 时间:2024/05/17 00:55
1.ExtJs之消息框:
语法:Ext.MessageBox.alert(Stringtitle, String msg,Function fn, Obejctscope); 参数定义:
2. ExtJs 之输入框
语法:Ext.MessageBox.prompt(Stringtitle, String msg,Function fn,Object scope,Boolean/Numbermultiline,String defaulttext);
参数定义:
3.ExtJs之确认框
语法:
Ext.MessageBox.confirm(Stringtitle, String msg,Function fn, Objectscope);
参数定义:
OK:只有"确定"按钮
CANCEL:只有"取消"按钮
OKCANCEL:有"确定"和"取消"按钮
YESNO: 有"是"和"否"按钮
YESNOCANCEL:有"是"、"否"和"取消"按钮
icons取值如下
INFO:信息图标
WARNING:警告图标
QUESTION:询问图标
ERROR:错误图标
5.ExtJs之进度条对话框
进度条对话框也是自定义消息框的一种,只是在配置Config时添progress=true即可,同时在设置其他相关信息,比如进度提示。
6.ExtJs之消息框动画效果
PS:弹框的宽度都是固定的,很多时候都会影响美观,相信很多人都会想着如何改变弹框的宽度。
Ext源码
1、progress : function(title, msg, progressText){
this.show({
title : title,
msg : msg,
buttons: false,
progress:true,
closable:false,
minWidth: this.minProgressWidth,
progressText: progressText
});
return this;
},
wait :function(msg, title, config){
this.show({
title : title,
msg : msg,
buttons: false,
closable:false,
wait:true,
modal:true,
minWidth: this.minProgressWidth,
waitConfig: config
});
return this;
},
修改宽度的代码为:Ext.MessageBox.minProgressWidth = 400;
例:
Ext.MessageBox.minPromptWidth = 400;
Ext.MessageBox.prompt("补充需求信息", "需求分析", analysisreq, this, 250,vanalysisReq);
原文引自:http://blog.sina.com.cn/s/blog_4d5d065f0101bctt.html
- title: 标题
- msg: 提示内容
- fn: 提示框关闭之后自动调用的回调函数
- scope: 作用域,用于指定this指向哪里
[javascript] viewplaincopy
- Ext.MessageBox.alert("提示框","这是一个提示框");
- Ext.MessageBox.alert("提示框","这是一个提示框",function(){
-
alert("提示框关闭") - });
2. ExtJs 之输入框
- title: 标题
- msg: 提示内容
- fn: 提示框关闭之后自动调用的回调函数
- scope: 作用域,用于指定this指向哪里
- Boolean/Number:如果为true或为数字,则表示允许输入多行或者指定默认高度
- defaulttext :输入框默认文本内容
[javascript] viewplaincopy
- Ext.MessageBox.prompt("输入框","请输入名字:",function(bu,txt){
-
Ext.MessageBox.alert("Result","你点击的是"+bu+"按钮,
+txt);输入的内容为:" - },this,300);
3.ExtJs之确认框
语法:
- title: 标题
- msg: 提示内容
- fn: 提示框关闭之后自动调用的回调函数
- scope: 作用域,用于指定this指向哪里
[javascript] viewplaincopy
- Ext.MessageBox.confirm("确认","请点击下面的按钮作出选择",function(btn{
-
Ext.MessageBox.alert("你单击的按钮是:"+btn); - });
4. ExtJs之自定义消息框
- title : 消息框标题栏
- msg:消息内容
- width:消息框的宽度
- multiline: 是否显示多行文本
- closable:是否显示关闭按钮
- buttons:按钮
- icon:图标
- fn:回调函数
[javascript] viewplaincopy
- var
config ={ -
title:"自定义对话框", -
msg:"这是一个自定义对话框", -
width:400, -
multiline:true, -
closable:false, -
buttons:Ext.MessageBox.YESNOCANCEL, -
icon:Ext.MessageBox.QUESTION, -
fn: function(btn,txt){ -
Ext.MessageBox.alert("Result","你点击了'yes'按钮
,输入的值是:"+txt); -
-
}; - Ext.MessageBox.show(config);
注意:在ExtJs.MessageBox中已经定义了buttons的取值.如下
引用
OK:只有"确定"按钮
CANCEL:只有"取消"按钮
OKCANCEL:有"确定"和"取消"按钮
YESNO: 有"是"和"否"按钮
YESNOCANCEL:有"是"、"否"和"取消"按钮
icons取值如下
引用
5.ExtJs之进度条对话框
[javascript] viewplaincopy
- Ext.MessageBox.show({
-
title:'请等待片刻', -
msg:'正在加载项目....', -
progressText:'正在初始化...', -
Width:300, -
progress:true, -
closable:false -
}); -
var function(v){f = -
return function(){ -
if(v == 12){ -
Ext.MessageBox.hide(); -
Ext.MessageBox.alert('完成','所有项目加载完成!'); -
}else{ -
var i = v/11; -
Ext.MessageBox.updateProgress(i,Math.round(100*i)+'%以完成'); -
} -
}; -
}; -
for(var i=0; i<13;i++){ -
setTimeout(f(i),i*500); -
}
解 析上述代码中ProgressText属性是进度条滚动之前最初的文本,滚动进程由updateProgress(Numbervalue,StringprogressText)方法来定义,参数value是从0-1之间的小数,表示进度百分比;progressText则表示进度条滚动过程中的文本提示信息。
6.ExtJs之消息框动画效果
[javascript] viewplaincopy
- var
config = { -
title:"飞出的消息框", -
msg:"这是一个自定义对话框,是飞出来的哦", -
width:400, -
multiline:true, -
closable:false, -
buttons:Ext.MessageBox.YESNOCANCEL, -
icon:Ext.MessageBox.QUESTION, -
animEl:"fly" -
}; -
Ext.MessageBox.show(config);
Ext源码
1、progress : function(title, msg, progressText){
修改宽度的代码为:Ext.MessageBox.minProgressWidth = 400;
例:
原文引自:http://blog.sina.com.cn/s/blog_4d5d065f0101bctt.html
0 0
- extjs各种弹出框
- extjs各种弹出框
- Extjs弹出框
- EXTJS 弹出提示框
- extjs各种弹出框
- extjs弹出框使用fckeditor
- Extjs自定义弹出框默认值
- ExtJs Combobox点击就弹出下拉框
- ExtJS实现弹出密码输入框
- ExtJS弹出框保存并退出
- Extjs弹出框的异步执行
- Extjs 弹出窗口
- extjs 右下角弹出窗口
- extjs 弹出窗口
- extjs文件上传成功后,却弹出了下载框!
- (四)ExtJs自定义弹出框(show)
- extjs使用 iframe嵌入框,点击事件弹出窗口显示
- Extjs 右下角弹出框 可弹出多个 冒泡小窗体
- OpenCV中对Mat里面depth,dims,channels,step,data,elemSize和数据地址计算的理解
- eclipse的自动提示及补全功能设置
- spring mvc 框架搭建及详解
- 我的CSDN第一篇博客
- EL表达式以及struts标签格式化时间…
- Extjs弹出框
- tomcat启动java web项目时报…
- MySql技术内幕之——InnoDB存储引擎…
- 关于MyEclipse查看底层源码出现sou…
- MySql中时间和日期函数
- Extjs上传文件时提示下载.action文…
- java web开发之高并发处理
- linux性能调优命令
- gson的简要介绍