SBGRID

전체메뉴보기

적용예시

그리드 속성 개인화 설정 (속성)

그리드내에서 데이터 영역의 셀 병합 타입을 설정합니다.

그리드 개인화 설정(메소드)

상세설명

mergecells

속성 : SBGridProperties.autosavepsnldata = value1;
- value1 : [boolean] 그리드 refresh로 개인화 정보를 자동 저장할지 여부
  - true : 자동 저장
  - false (default) : 자동 저장하지 않음
속성 : SBGridProperties.psnldataid = value1;
- value1 : [string] 개인화를 저장할 ID

제약사항

개인화 기능은 IE9 부터 지원이 가능합니다.
제공하고 있는 개인화 기능은 그리드의 너비(width), 열의 위치(move), 열의 숨김(hidden)에 대해서만 제공하고 있습니다.

예시

Ctrl + 마우스엔터로 여러열을 선택한 후 버튼을 클릭해 보세요.

							var datagrid;
							var SBGridProperties = {};
							
							function createGrid(){
								SBGridProperties.parentid = 'SBGridArea';
								SBGridProperties.id = 'datagrid';
								SBGridProperties.jsonref = 'ct_data.resources';
								SBGridProperties.selectmode = 'free';
								SBGridProperties.autosavepsnldata = true;
								SBGridProperties.psnldataid = 'softbowl';
								SBGridProperties.columns = [
									{caption : [''],               ref : 'check',		 width : '30px',	style : 'text-align:center',    type : 'checkbox'},
									{caption : ['학원명'],          ref : 'academy',	   width : '168px',	  style : 'text-align:center',    type : 'input'},
									{caption : ['설립자(성명)'],	   ref : 'name',		 width : '163px',	style : 'text-align:center',    type : 'output'},
									{caption : ['전화번호'],		ref : 'phone',		  width : '120px',	 style : 'text-align:center',	 type : 'input'},
									{caption : ['학원주소'],		ref : 'addr',		  width : '407px',	 style : 'text-align:center',	 type : 'textarea'},
									{caption : ['교습과정'],		ref : 'curriculum',	  width : '100px',	 style : 'text-align:center',	 type : 'inputcombo',   typeinfo : {ref : 'newComboData', displayui : true, label : 'label', value : 'value'}},
									{caption : ['교습과목(반)'],	   ref : 'class2',		 width : '100px',	style : 'text-align:center',	type : 'combo',        typeinfo : {ref : 'classData',    displayui : true, label : 'label', value : 'value',  filtering : {usemode : true, uppercol : 5, attrname : 'code'}}},
									{caption : ['교육시작일'],	   ref : 'startday',	 width : '100px',	style : 'text-align:center',	type : 'datepicker',   typeinfo : {locale : 'ko' , dateformat :'yymmdd'}, format : {type:'date', rule:'yyyy-mm-dd', origin : 'yyyymmdd' }},
									{caption : ['교육종료일'],	   ref : 'endday',	 	 width : '100px',	style : 'text-align:center',	type : 'inputdate',    typeinfo : {locale : 'ko' , dateformat :'yymmdd'}, format : {type:'date', rule:'yyyy-mm-dd', origin : 'yyyymmdd' }},
									{caption : ['바로가기'],	    ref : 'link',		  width : '100px',	 style : 'text-align:center',	 type : 'outputbutton'}
								];
								datagrid = _SBGrid.create(SBGridProperties);
							};
					
							function hideColumns(){
								if (_.size(datagrid.getSelectedCols()) < 1 ) {
									alert('그리드의 셀을 선택하셔야 합니다.');
									return;
								}
					
								// 그리드 열의 뒤쪽부터 숨겨서 index 의 변동을 막는다.
								$.each(datagrid.getSelectedCols().reverse(), function(key,index){
									datagrid.setColHidden(index, true);
								});
							}
					
							function showColumns(){
								for (var i=0 ; i < datagrid.getCols(); i++){
									if (datagrid.getColHidden(i)){
										datagrid.setColHidden(i, false);
									}
								}
							}
					
							function loClear() {
								localStorage.clear();
								datagrid.rebuild();
							}