Datagrid ??Datagrid란 간단하게 데이터 값을 화면에 불어넣는 툴로 정해진 코드로 화면에 테이블 형태로 데이터를 그려줍니다.쉽게 웹에서 사용할 수 있는 데이터 그리드, 차트, 트리를 구성할 수 있는 UI 툴이라고 보시면 되겠습니다.
JavaScript datagrid 라이브러리 nexacro platform , AXISJ , ExtJS , realgrid , rMate , kendo UI , jqGrid , WebSquare , jQuery Table Sroter , SlickGrid , .. 等
JavaScript chart 라이브러리 rMate , chart , JqPlot , Morris , xChart , sigmajs , HighCharts , Fusion Charts , jscharts , google Chart , canvasjs , .. 等
EasyUI ?? 공식 사이트 : https://www.jeasyui.com/index.phpEasyUI 는 datagrid, treegrid, calendar.. 등을 제공하는 Javascript framework으로 사용자 인터페이스의 구성요소집입니다.- j Query, Angular, Vuew, React에 사용 가능
EasyUI선언방법 HTML 내 직접선언 시 데이터-options 속성 중 EasyUI설정 값을 정의하여 사용(json형식)하거나 태그 속성(속성명=”값”)으로 사용할 수 있습니다. JavaScript에서 선언할 때 그 태그 실렉터로 EasyUI이벤트(combobox, datagrid, . 등)함수를 생성하고 정의합니다.
EasyUI 사용 옵션title : 제목 (그리드 상단)iconCls : 아이콘 (그리드 상단) rownumbers : 왼쪽 순서(boolean값) pagination : 페이지ㅣ지네이션의 유무(boolean값) pageSize : 표시 목록의 개수total : 그리드의 사이즈url: 요청 URL methodal : 요청 URL method: 요청 방식 (get, poolean)
- HTML 내에서 직접선언 data-options 속성 중에 EasyUI 설정값을 정의하여 사용(json형식)하거나 태그에 속성(속성이명=”값”)으로 사용2. JavaScript에 선언 태그 셀렉터로서 EasyUI 이벤트(combobox, datagrid 등) 함수를 생성하여 정의 예)
Datagrid 사용[HTML 부분] Da tagrid 사용[JavaScript 부분]Combo-Box사용
출처 일라이더, https://erider.co.kr/121, 2016/09/27 EasyUI, https://www.jeasyui.com/demo/main/index.php