.“Extjs之進度條的控制”

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Ext4.aspx.cs" Inherits="EXT1.Ext4" %>
2
3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4
5 <html xmlns="http://www.w3.org/1999/xhtml" >
6 <head runat="server">
7 <title>第四課,進度條的應用</title>
8 <link href="ext-3.2.0/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
9 <script src="ext-3.2.0/adapter/ext/ext-base.js" type="text/javascript"></script>
10 <script src="ext-3.2.0/ext-all.js" type="text/javascript"></script>
11 </head>
12 <body>
13 <form id="form1" runat="server">
14 <div id="id1">
15 <script type="text/javascript">
16 Ext.BLANK_IMAGE_URL="MyImage/dlg-bg.gif";
17 function Read1() {
18 Ext.Msg.wait("內容","Extjs進度條應用",{text:"正在加載。。。"});
19 }
20 function Read2() {
21 Ext.Msg.show({
22 modal:false,
23 title:"標題",
24 msg:"內容",
25 closable:true,
26 width:300,
27 wait:true
28 })
29 }
30 function Read3() {
31 Ext.Msg.show({
32 title:"標題",
33 msg:"內容",
34 modal:true,
35 closable:true,
36 width:300,
37 progress:true,
38 progressText:"保存進度"
39 })
40 }
41 function Read4() {
42 var progressBar=Ext.Msg.show({
43 title:"標題",
44 msg:"通過進度的大小來控制進度",
45 progress:true,
46 width:300
47 });
48 var count=0;
49 var bartext="";
50 var curnum=0;
51 Ext.TaskMgr.start({
52 run:function () {
53 count++;
54 if (count>=10) {
55 progressBar.hide();
56 }
57 curnum=count/10;
58 bartext=curnum*100+"%";
59 progressBar.updateProgress(curnum,bartext);
60 },
61 interval:1000
62 })
63 }
64 function Read5() {
65 var progressBar=Ext.Msg.show({
66 title:"標題",
67 msg:"通過固定時間完成進度",
68 width:300,
69 wait:true,
70 waitConfig:{interval:500,duration:5000,fn:function () {
71 Ext.Msg.hide();
72 }},
73 closable:true
74 });
75 // setTimeout(function () {
76 // Ext.Msg.hide();
77 // },5000);
78 }
79
80 function Read7() {
81 var msgbox=Ext.Msg.show({
82 title:"進度條應用",
83 msg:"提示內容",
84 closable:true,
85 width:300,
86 modal:true,
87 progress:true
88 });
89 var count=0;
90 var curnum=0;
91 var msgtext="";
92 Ext.TaskMgr.start({
93 run:function () {
94 count++;
95 if (count>10) {
96 msgbox.hide();
97 }
98 curnum=count/10;
99 msgtext="當前加載:"+curnum*100+"%";
100 msgbox.updateProgress(curnum,msgtext,'當前時間:'+new Date().format('Y-m-d g:i:s A'));
101 },
102 interval:1000
103
104 })
105
106 }
107 function Read8() {
108 var progressBar=new Ext.ProgressBar({
109 text:'working......',
110 width:300,
111 applyTo:id2
112 });
113 var count=0;
114 var curnum=0;
115 var msgtext="";
116 Ext.TaskMgr.start({
117 run:function () {
118 count++;
119 if (count>10) {
120 progressBar.hide();
121 }
122 curnum=count/10;
123 msgtext=curnum*100+"%";
124 progressBar.updateProgress(curnum,msgtext);
125 },
126 interval:1000
127 })
128 }
129 function Read9() {
130 //自動模式進度條
131 var progressBar=new Ext.ProgressBar({
132 text:'waiting......',
133 width:300,
134 applyTo:id2
135 });
136 progressBar.wait({
137 interval:1000,
138 duration:10000,
139 increment:10,
140 scope:this,
141 fn:function () {
142 alert("更新完畢");
143 }
144 });
145 }
146 function Read6() {
147 //字定義漂亮進度條
148
149 }
150 Ext.onReady(Read9);
151 </script>
152 </div>
153 <div id="id2">
154 </div>
155
156 </form>
157 </body>
158 </html>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章