티스토리 뷰
FlexiGrid: 무료 그리드 위젯 라이브러리
- jqGrid와 유사한 jQuery 기반의 무료 JavaScript Grid 위젯 라이브러리
- 서버 사이드에 대한 JSON 데이터소스 요청, 싱글/멀티 로우 셀렉션, 페이징을 지원
- 관련링크
FlexiGrid Introduction
http://code.google.com/p/flexigrid/
FlexiGrid v1.1 Download
http://flexigrid.googlecode.com/files/flexigrid-1.1.zip
FlexiGrid Tutorial
http://code.google.com/p/flexigrid/wiki/TutorialPropertiesAndDocumentation
FlexiGrid FAQ
http://code.google.com/p/flexigrid/wiki/FAQ
FlexiGrid Example Demo
http://sanderkorvemaker.nl/test/flexigrid/
Twitter Bootstrap에서 위화감없이 레이아웃 최적화하기
- CSS 최적화
select[name="rp"] {
width: auto;
}
input[size="4"] {
width: auto;
}
div.flexigrid {
font-size: 10pt;
}
- HTML 최적화
<div style="overflow: auto">
<table id="someTable"></table>
</div>
- JavaScript 최적화
$('#someTable').flexigrid({ ... width : 'auto', height : 'auto' ... });
- 주요 메써드
// 새로운 주소로 그리드 재로드
$('#someTable').flexOptions({url : 'someURL'}).flexReload();
// 새로운 객체로 그리드 재로드
$('#someTable').flexAddData(someDataSource).flexReload();
// 데이터소스의 객체 구조
var someDataSource = {
total : '3', // 전체 페이지 개수
page : '2', // 현재 페이지 번호
rows : [ {
id : '1001', // 해당 로우의 PK 필드 값
cell : [ 'someValue1', 'someValue2', 'someValue3', 'someValue4', 'someValue5' ] // 그리드에 순서대로 출력될 필드 값
} ]
};
- Total
- Today
- Yesterday
- graylog
- Docker
- 로드 바이크
- maven
- Kendo UI Web Grid
- spring
- Spring MVC 3
- 구동계
- 로드바이크
- java
- bootstrap
- Eclipse
- 평속
- JavaScript
- 알뜰폰
- 태그를 입력해 주세요.
- 자전거
- chrome
- kotlin
- DynamoDB
- Spring Boot
- node.js
- CentOS
- Tomcat
- MySQL
- JHipster
- Kendo UI
- jstl
- jpa
- jsp
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
31 |