Ext js 틀고정 그리드
Scripter/EXTJS / 2009. 11. 15. 18:19
국내환경에서 Ajax Library/Framework에서만 제공하는 기본 컴포넌트/위젯으로는 어려운 경우가 많은데 오늘 우연찮게 블로그 유입경로를 보다가 유난히 틀고정 그리드를 찾는 분들이 많아 포스팅한다.
Ext js 의 포럼글에서 우연찮게 찾아 북마킹해 놓은 것이 있어 공개한다. 아래 소스를 조금 수정하여 열고정, 행고정이 되는 그리드 컴포넌트를 만들어 보는것도 좋을듯....
Markup
<html xmlns="http: //www.w3.org/1999/xhtml" xml: lang="en" lang="en">
<head>
<link rel="stylesheet" type="text/css" href="../lib/ext-3.0.3/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="columnLock.css" />
<script type="text/javascript" src="../lib/ext-3.0.3/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../lib/ext-3.0.3/ext-all.js"></script>
<script type="text/javascript" src="columnLock.js"></script>
컬럼모델 config 파일은 다음과 같이 작성한다.
columns: [
{id:'company',header: "Company", width: 120, sortable: true, dataIndex: 'company', locked: true},
{header: "Price", width: 150, sortable: true, renderer: 'usMoney', dataIndex: 'price'},
{header: "Change", width: 150, sortable: true, renderer: change, dataIndex: 'change'},
{header: "% Change", width: 150, sortable: true, renderer: pctChange, dataIndex: 'pctChange'},
{header: "Last Updated", width: 150, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
],
Ext js 3.0x 이상
Ext js 2.1~ 2.2 버전
'Scripter > EXTJS' 카테고리의 다른 글
Ext.Updater 깜빡거림 방지 (0) | 2009.05.06 |
---|---|
Extjs Core 3.0 Beta 릴리즈 (4) | 2009.04.07 |
Examples Of ExtJS in Action (2) | 2009.03.31 |
extjs RowAction 붙이기 (1) | 2009.03.31 |
extjs 2.2의 IE에서 iframe document load 버그패치 (0) | 2009.01.21 |