Ext.MessageBox.Show使用Progress

在此之前,先添加引用:以下引用方式仅供参考:由于我的extjs文件夹放在script文件夹下

    <link href="~/Scripts/extjs/resources/ext-theme-neptune/ext-theme-neptune-all.css" rel="stylesheet" />
    <!--4.0后用bootstrap.js替代adapter\-->
    <script src="~/Scripts/extjs/bootstrap.js"></script>
    <script src="~/Scripts/extjs/locale/ext-lang-zh_CN.js"></script>

<script type="text/javascript" >

Ext.onReady(function () {
            //Show progress dialog
            Ext.Msg.show({
                title: "Message",
                msg: "Loading,please wait...",
                icon: Ext.Msg.INFO,
                progress: true,
                closable: false,
                width:350,
                fn: function (btn, txt) {
                    //alert(Ext.String.format("click the '{0}' value is '{1}'", btn, txt));
                }
            });
            //progress bar refresh count、percent、display msg
            var count = 0, percent = 0, progressMsg;
            //define timers task to update progress info
            var task = {
                run: function () {
                    count++;
                    percent = count;
                   // Ext.Msg.alert("d",percent);
                    progressMsg = Ext.String.format("当前进度:{0}%,当前时间:{1}", percent,Ext.Date.format(new Date(),"Y-m-d H:i:s ms"));
                    Ext.Msg.updateProgress(percent/100, progressMsg);
                    if (count >= 100)
                    {
                        Ext.TaskManager.stop(task);
                        //Ext.Msg.hide("destory");
                        Ext.Msg.alert("信息", "加载完毕");
                    }
                },
                interval:10
            };
            Ext.TaskManager.start(task);
        })

</script>

o啦,就这么简单就可以创建一个progress,如图:

连css都省了 爽吧!

以上仅供参考,如有问题 欢迎指出...

posted @ 2013-10-16 14:35  程序有Bug  阅读(696)  评论(0编辑  收藏  举报