Ext Js入门第11篇-使用Ext.window.Window和Ext.window.MessageBox创建对话框

来源：互联网发布：ubuntu repair 编辑：程序博客网时间：2024/05/28 23:09

1.Ext.window.Window继承Ext.panel.Panel,用它创建窗口

<script>     Ext.onReady(function()     {     //创建窗口     Ext.create('Ext.window.Window',     {     title:'查询图书',     height:220,     html:'java体系书',     tools:[          {          type:'save',          tooltip:'保存数据',          handler:function(event,toolEl,panel){          alert('用户保存数据');          }          }     ],     dockedItems:[          {          xtype:'toolbar',          dock:'bottom',          items:[               {               text:'按钮1',               },               '',               '-',               '普通文本',               {xtype:'tbspacer'},               '合计信息',               {xtype:'tbseparator'},               {xtype:'tbfill'},               {               text:'按钮2',               },          ]          }     ]     //显示窗口     }).show();     });</script>

2.使用Ext.window.MessageBox创建对话框

<body><button onclick='Ext.Msg.alert("提醒","这是一个警告对话框",function(){Ext.DomHelper.overwrite("target",id+"按钮被点击");})'>警告对话框</button><button onclick='Ext.Msg.confirm("确认","这是一个确认对话框",function(id){Ext.DomHelper.overwrite("target",id+"按钮被电击");})'>确认对话框</button><button onclick='Ext.Msg.prompt("输入","这是一个输入对话框",function(id,txt){Ext.DomHelper.overwrite("target",id+"按钮被电击<br/>输入你的名字是："+txt);})'>输入对话框</button>    <button onclick='    var percent=0;    var progress=Ext.Msg.progress("上传文件","文件上传中。。。","文件正在上传。。。");    //启动任务来修改进度条进度    Ext.TaskManager.start({    //指定任务包装函数    run:function(){    progress.updateProgress(percent+=0.05);    //进度完成，关闭进度条对话框    if(percent>=1.0){    progress.close();    }    },    //指定每隔0.2秒执行一次    interval:200,    //指定重复次数    repeat:20    });    '>进读条对话框</button>    <button onclick='    var msg=Ext.Msg.wait("请等待","等待执行任务。。。"    ,{    interval:500,    duration:5000,    increment:10,    text:"等待。。",    scope:this,    fn:function(){    Ext.DomHelper.overwrite("target","等待结束，请继续操作！");    msg.close();    }    });    '>等待</button>    <button onclick='    Ext.Msg.show({    title:"选项",    msg:"这是选项对话框",    multiline:true,    buttons:Ext.Msg.YESNOCANCEL,    progress:true,    icon:"ava",    fn:function(id){    Ext.DomHelper.overwrite("target",id+"被电击");    }    });    '>选项对话框</button>    <div id="target"></div></body>

阅读全文

0 0