Extjs 프로세스바 구현하기
Scripter/EXTJS / 2008. 2. 21. 19:50
아래와 같은 상태진행(progress)바를 생성할때 사용합니다.
Ext.onReady(function() {
var percent;
var textfield;
var testPanel = new Ext.Panel( {
title : 'progressbar test',
collapsible : true,
renderTo : document.body,
width : 600,
height : 200,
bodyStyle : 'padding:10px',
html : '<div id="_progress_"></div>',
tbar : [
percent = new Ext.form.NumberField( {
id : '_1_',
maxValue : 100,
minValue : 0,
width : 50,
value : '20'
}),
textfield = new Ext.form.TextField( {
id : '_2_',
width : 400,
value : '다운로드: - Application already exists at path /bcf'
}),
'-',
{
text : '변경',
handler : function() {
// 상태바의 값을 입력한 값으로 계산하여 뿌려준다.
pbar.updateProgress(parseInt(percent.getValue()) / 100,
percent.getValue() + '% - '
+ textfield.getValue());
}
}]
});
// 실제 프로그래스바를 생성하는 컴포넌트
var pbar = new Ext.ProgressBar( {
text : 'Initializing...',
autoWidth : false,
width : '100%',
cls : 'left-align',
renderTo : '_progress_'
});
});
}
<body><div id="techbugbar" ></div>
var percent;
var textfield;
var testPanel = new Ext.Panel( {
title : 'progressbar test',
collapsible : true,
renderTo : document.body,
width : 600,
height : 200,
bodyStyle : 'padding:10px',
html : '<div id="_progress_"></div>',
tbar : [
percent = new Ext.form.NumberField( {
id : '_1_',
maxValue : 100,
minValue : 0,
width : 50,
value : '20'
}),
textfield = new Ext.form.TextField( {
id : '_2_',
width : 400,
value : '다운로드: - Application already exists at path /bcf'
}),
'-',
{
text : '변경',
handler : function() {
// 상태바의 값을 입력한 값으로 계산하여 뿌려준다.
pbar.updateProgress(parseInt(percent.getValue()) / 100,
percent.getValue() + '% - '
+ textfield.getValue());
}
}]
});
// 실제 프로그래스바를 생성하는 컴포넌트
var pbar = new Ext.ProgressBar( {
text : 'Initializing...',
autoWidth : false,
width : '100%',
cls : 'left-align',
renderTo : '_progress_'
});
});
}
<body><div id="techbugbar" ></div>
'Scripter > EXTJS' 카테고리의 다른 글
| Extjs 레이아웃에서 center region 숨기기 꽁수 (0) | 2008.02.22 |
|---|---|
| Extjs 그리드안에서 프로세스바 구현하기 (3) | 2008.02.21 |
| Extjs을 이용한 특정이벤트 컨텍스트 메뉴달기 (0) | 2008.02.21 |
| Extjs와 Adobe AIR를 이용한 Window.gadget만들기 (0) | 2008.02.20 |
| Extjs ASP.NET Web Controls (0) | 2008.02.19 |