ExtJs学习之MessAgeBox的使用
1、Ext.MessageBox.alert()
调用格式:
alert( String title, String msg, [Function fn], [Object scope] )
参数说明:
title:提示框的标题。
msg:显示的消息内容。
[Function fn]:(可选)回调函数。
[Object scope]:(可选)回调函数的作用域。
ExtJS MessageBox alert支持HTML格式文本。
Ext.onReady(function () {
Ext.MessageBox.alert("提示", "Hello World !",
function (id) { alert("单击的按钮是:" + id);
});
});
2、Ext.MessageBox.confirm()
调用格式:
confirm( String title, String msg, [Function fn], [Object scope] )
Ext.onReady(function () {
Ext.MessageBox.confirm("提示", "请单击我,做出选择!", function (id) { alert("单击的按钮是:" + id); });
});
3、Ext.MessageBox.prompt()
调用格式:
confirm( String title, String msg, [Function fn], [Object scope], [Boolean/Number multiline], [String value] )
参数说明:
[Boolean/Number multiline]:设置为false将显示一个单行文本域,设置为true将以默认高度显示一个多行文本区。或者以像素为单位直接设置文本域的高度。默认为false。
Ext.onReady(function () {
Ext.MessageBox.prompt("提示", "请输入内容:", function (id, msg) { alert("单击的按钮ID是:" + id + "\n" +"输入的内容是:" + msg); }, this, true, "我是默认值");
});
4、Ext.MessageBox.show()
Ext.MessageBox常用配置项:
| 配置项 | 类型 | 说明 |
|---|---|---|
| title | String | 提示框标题 |
| msg | String | 显示的消息内容 |
| width | Number | 对话框的宽度,以px为单位 |
| maxWidth | Number | 对话框的最大宽度,默认为600px |
| minWidth | Number | 对话框的最小宽度,默认为100px |
| closable | Boolean | false将隐藏右上角的关闭按钮,默认为true |
| modal | Boolean | true为模态窗口,false为非模式窗口 |
| fn | Function |
回调函数 参数说明: buttonId:按钮id text:输入的文字 opt:传入show方法的配置对象 |
| buttons | Number/Boolean | 按钮组,默认为false,不显示任何按钮 |
| progress | Boolean | true则显示一个进度条,默认为false,该进度条需要由程序控制滚动 |
| progressText | String | 进度条上显示的文字,默认为“” |
| proxyDrag | Boolean | true则显示一个highlight拖动代理,默认为false |
| wait | Boolean | true则显示一个自动滚动的进度条,默认为false |
| waitConfig | Object | 等待进度条的配置对象,在wait为true时有效 |
| prompt | Boolean | true则显示一个单行文本域,默认为false |
| value | String | 如果prompt设置为true,则value值将显示在文本域中 |
| multiline | Boolean | 如果prompt设置为true,则multiline为true显示多行文本域,false显示单行文本域 |
| defaultTextHeight | Number | 多行文本域的默认高度,默认值为75px |
| icon | String | 一个样式文件,它为对话框提供一个背景图 |
Buttons配置项:
| 提示框按钮配置对象 | 说明 |
|---|---|
| Ext.Msg.CANCEL | 只显示一个“取消”按钮 |
| Ext.Msg.NO | 只显示一个“否”按钮 |
| Ext.Msg.OK | 只显示一个“确定”按钮 |
| Ext.Msg.OKCANCEL | 显示两个按钮,“确定”和“取消” |
| Ext.Msg.YES | 只显示一个“是”按钮 |
| Ext.Msg.YESNO | 显示两个按钮,“是”和“否” |
| Ext.Msg.YESNOCANCEL | 显示三个按钮,“是”、“否”和“取消” |
图标样式说明:
| 样式表 | 说明 |
|---|---|
| Ext.Msg.ERROR | 错误图标 |
| Ext.Msg.INFO | 信息图标 |
| Ext.Msg.QUESTION | 问题图标 |
| Ext.Msg.WARNING | 警告图标 |
调用格式:
show( Object config)
参数说明:
一个包含提示框配置信息的配置对象
返回值:
Ext.window.MessageBox
Ext.onReady(function () {
Ext.MessageBox.show({
title: "提示",
msg: "三个按钮、一个多行文本域",
modal: true,
prompt: true,
value: "请输入",
fn: function (id, msg) {
Ext.MessageBox.alert("单击的按钮id是:" + id + "\n" + "输入的内容是:" + msg);
},
buttons: Ext.Msg.YESNOCANCEL,
icon: Ext.Msg.QUEATION
});
});
5、Ext.MessageBox.wait()
调用格式:
wait( String msg, [String title] , [Object config] )
参数说明:
msg:显示的消息内容。
[String title]:提示框标题,为可选参数。
[Object config]:用于配置进度条的配置对象,为可选参数。
返回值:
Ext.window.MessageBox
Ext.onReady(function () {
Ext.MessageBox.wait("请等待,操作需要一定时间!", "提示", {
text:"进度条上的文字"
});
});
ExtJs学习之MessAgeBox的使用的更多相关文章
- ExtJS学习之MessageBox
MessageBox为ExtJS中的消息对话框,包括alert confirm prompt show四种. 1.index.html <!DOCTYPE html PUBLIC " ...
- ExtJs学习之Window
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- ExtJs学习笔记之学习小结LoginDemo
ExtJs学习小结LoginDemo 1.示例:(登录界面) <!DOCTYPE html> <html> <head> <meta charset=&quo ...
- ExtJS学习第一天 MessageBox
此文用来记录学习笔记: •学习任何技术,首先都要从Helloworld开始,那么我们首要任务就是写一个简单的HelloWorld程序,带领同学们走进ExtJS的世界. •Ext.onReady:这个方 ...
- ExtJS学习之路第四步:看源码,实战MessageBox
可以通过看MessageBox.js的源码来深入认识,记住它的主要用法.Ext.MessageBox是实用类,用于生成不同风格的消息框,它是Singleton(单例),别名Ext.Msg.注意Mess ...
- Extjs 学习笔记1
学习笔记 目 录 1 ExtJs 4 1.1 常见错误处理 4 1.1.1 多个js文件中有相同的控件,切换时无法正常显示 4 1.1.2 Store的使用方法 4 1.1.3 gridPanel ...
- ExtJS学习之路第五步:认识最常见组件Panel
文档中描述 Panel(面板)是一个容器,它具有特定的功能和结构部件,这使它成为面向应用用户界面的完美基石.面板,继承自Ext.container.Container,能够配置布局以及子组件(Chil ...
- extjs 学习笔记(二)
EXTJS实用开发指南 1. 要使用ExtJS 框架的页面中一般包括下面几句: <link rel="stylesheet" type="text/css" ...
- ExtJS学习
ExtJS是一门比较纠结的框架,自己不太熟,因为现在在做一些老项目,所以没办法要学点.记录下.其实Ext也不是很难,主要是多查查API,了解其基本的用法,然后慢慢去学习,学成之后做管理系统还是很有优势 ...
随机推荐
- 2017.11.4 JavaWeb-----基于JavaBean+JSP求任意两数代数和(改进的在JSP页面中无JSP脚本代码的)+网页计数器JavaBean的设计与使用
修改后的JSP中不含有JSP脚本代码这使得JSP程序的清晰性.简单 1.设计JavaBean 的Add.java 类 package beans; public class Add { private ...
- javaweb基础(36)_jdbc进行批处理
在实际的项目开发中,有时候需要向数据库发送一批SQL语句执行,这时应避免向数据库一条条的发送执行,而应采用JDBC的批处理机制,以提升执行效率. JDBC实现批处理有两种方式:statement和pr ...
- Shell编程学习之重定向
这一篇讲一下重定向 有些时候你想要保存某些命令产生的输出而不是在显示器上显示它. 为了应对这样的问题 bash shell 也就提供了一些重定向的操作符. 我们先了解一些基本的应用. 输出重定向 输出 ...
- 第一个AngularJS表达式实例
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- BZOJ2005: [Noi2010]能量采集(容斥原理 莫比乌斯反演)
Time Limit: 10 Sec Memory Limit: 512 MBSubmit: 4727 Solved: 2877[Submit][Status][Discuss] Descript ...
- 爬虫学习(十九)——Scrapy的学习及其使用
Scrapy框架的介绍 Scrapy,非常的强悍,通过python语言编写的,非常知名的爬虫框架 框架工作流程 框架流程图 基本工作流程; 1.引擎向spiders要url 2.引擎将要爬取的url给 ...
- spring-bean(注解方式-管理及依赖注入)
Bean管理(注解方式) 1.添加注解的依赖包:Spring-aop.jar 2.配置spring的XML文件的引入(查官方源码) 3.开启注解的扫描 <context:component-sc ...
- ofbiz最新版13.07.01环境搭建、安装(linux环境下)
一.软件必备: 1.jdk1.7 2.mysql5.6 3.安装tomcat 二.安装: 1.安装 JDK1.7 2.安装mysql数据库 3.下载apache-ofbiz-13.07.01.zip ...
- 交换机基础设置之vtp管理vlan设置
vtp的设置有三种模式1:server模式,负责创建,删除vlan(服务器模式) 2:client模式,负责接收并转发来自server的信息(客户机模式) 3:transparent模式,只负责转发, ...
- [CodeForces238E]Meeting Her(图论+记忆化搜索)
Description 题目链接:Codeforces Solution 因为路线随机,所以找出各路线最短路必须经过的点,在这个点必定能上车 直接floyd暴力找割点 然后不断用k条公交车路线来更新D ...