ExtJs Alert

转载 2015年07月06日 22:20:03
Ext.require([
    'Ext.window.MessageBox',
    'Ext.tip.*'
]);

Ext.onReady(function(){
    Ext.get('mb1').on('click', function(e){
        Ext.MessageBox.confirm('Confirm', 'Are you sure you want to do that?', showResult);
    });

    Ext.get('mb2').on('click', function(e){
        Ext.MessageBox.prompt('Name', 'Please enter your name:', showResultText);
    });

    Ext.get('mb3').on('click', function(e){
        Ext.MessageBox.show({
           title: 'Address',
           msg: 'Please enter your address:',
           width:300,
           buttons: Ext.MessageBox.OKCANCEL,
           multiline: true,
           fn: showResultText,
           animateTarget: 'mb3'
       });
    });

    Ext.get('mb4').on('click', function(e){
        Ext.MessageBox.show({
           title:'Save Changes?',
           msg: 'You are closing a tab that has unsaved changes. <br />Would you like to save your changes?',
           buttons: Ext.MessageBox.YESNOCANCEL,
           fn: showResult,
           animateTarget: 'mb4',
           icon: Ext.MessageBox.QUESTION
       });
    });

    Ext.get('mb6').on('click', function(){
        Ext.MessageBox.show({
           title: 'Please wait',
           msg: 'Loading items...',
           progressText: 'Initializing...',
           width:300,
           progress:true,
           closable:false,
           animateTarget: 'mb6'
       });

       // this hideous block creates the bogus progress
       var f = function(v){
            return function(){
                if(v == 12){
                    Ext.MessageBox.hide();
                    Ext.example.msg('Done', 'Your fake items were loaded!');
                }else{
                    var i = v/11;
                    Ext.MessageBox.updateProgress(i, Math.round(100*i)+'% completed');
                }
           };
       };
       for(var i = 1; i < 13; i++){
           setTimeout(f(i), i*500);
       }
    });

    Ext.get('mb7').on('click', function(){
        Ext.MessageBox.show({
           msg: 'Saving your data, please wait...',
           progressText: 'Saving...',
           width:300,
           wait:true,
           waitConfig: {interval:200},
           icon:'ext-mb-download', //custom class in msg-box.html
           animateTarget: 'mb7'
       });
        setTimeout(function(){
            //This simulates a long-running operation like a database save or XHR call.
            //In real code, this would be in a callback function.
            Ext.MessageBox.hide();
            Ext.example.msg('Done', 'Your fake data was saved!');
        }, 8000);
    });

    Ext.get('mb8').on('click', function(){
        Ext.MessageBox.alert('Status', 'Changes saved successfully.', showResult);
    });

    //Add these values dynamically so they aren't hard-coded in the html
    Ext.fly('info').dom.value = Ext.MessageBox.INFO;
    Ext.fly('question').dom.value = Ext.MessageBox.QUESTION;
    Ext.fly('warning').dom.value = Ext.MessageBox.WARNING;
    Ext.fly('error').dom.value = Ext.MessageBox.ERROR;

    Ext.get('mb9').on('click', function(){
        Ext.MessageBox.show({
           title: 'Icon Support',
           msg: 'Here is a message with an icon!',
           buttons: Ext.MessageBox.OK,
           animateTarget: 'mb9',
           fn: showResult,
           icon: Ext.get('icons').dom.value
       });
    });

    function showResult(btn){
        Ext.example.msg('Button Click', 'You clicked the {0} button', btn);
    };

    function showResultText(btn, text){
        Ext.example.msg('Button Click', 'You clicked the {0} button and entered the text "{1}".', btn, text);
    };
});

Ext.Msg.show({
                title:'确认',
                msg: '只弹出确认按钮',
                icon: Ext.MessageBox.INFO,
                buttons: Ext.MessageBox.OK
            });

有关于在Extjs4环境中,window窗口下的messageBox弹窗的bug以及解决方案

在使用Extjs4进行前端开发时发现,当 http://sandbox.runjs.cn/show/vijnwoug
  • kun525331194
  • kun525331194
  • 2014年10月20日 15:30
  • 1897

[EXTJS]让Extjs也能有类似JS中alert的功能

以前学习JS文件编写时候经常使用alert函数帮助查看当前值的信息。 初学EXTJS发现不能随心所以的利用alert打印信息很,经常打印出一些object出来坑爹。后来发现利用console可以把信息...
  • blueheartsbr
  • blueheartsbr
  • 2013年08月06日 16:08
  • 383

设置EXtjs中MessageBox的内容居中

在使用Extjs框架进行开发 过程发现,使用Ext.Msg.alert('标题');
  • kun525331194
  • kun525331194
  • 2014年10月29日 16:39
  • 2041

alert()实现原理的探索!(c++底层机制我也不懂啊!)

作者:貘吃馍香 链接:http://www.zhihu.com/question/20963787/answer/34123046 来源:知乎 著作权归作者所有,转载请联系作者获得授权 ...
  • qq_34986769
  • qq_34986769
  • 2016年08月09日 13:32
  • 865

经典重写alert方法

//改写alert window.alert = function(txt) { var shield = document.createElement("DIV"); shield.id = "...
  • jintianhen1
  • jintianhen1
  • 2013年11月30日 10:55
  • 3359

我的第一个javascript程序--alert为何弹不出数据?

今天啃的一本javascript的书籍,着手试了一个入门小例子,但我遇到了一个问题:最简单的alert竟然无法弹出数据。 第一课--html中嵌入javascript代码 总...
  • sinat_29398599
  • sinat_29398599
  • 2017年03月23日 22:51
  • 487

BeAlert 一款alert和confirm美化插件(优化)

BeAlert 这是一个美化版的alert和confirm弹出框插件,适用于IE7+、chrome、Edge、fireFox、Safari等绝大多数浏览器。 功能可自己拓展,这里只是一个基础版本的插...
  • a709869919
  • a709869919
  • 2017年04月17日 22:38
  • 1139

Bootstrap 简单认识之Alert组件

认识Bootstrap之前 这里下载的是Bootstrap v4.0 dev 版本 css预处理器使用了sass js使用了es6 Bootstrap是依赖于Jquery的,其所有javascript...
  • u012062760
  • u012062760
  • 2017年03月02日 20:00
  • 3035

js重写alert事件,避免alert弹框标题出现网址

js代码: window.alert = function(msg, callback) { var div = document.createElement("div"); div.innerH...
  • u011511210
  • u011511210
  • 2017年01月13日 10:29
  • 5320

js替换alert弹窗

替换alert的弹出的警告框和Confirm对话框,样式可自行修改
  • cjqcsdn
  • cjqcsdn
  • 2016年04月29日 17:32
  • 308
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:ExtJs Alert
举报原因:
原因补充:

(最多只允许输入30个字)