Group Column 전체 Collapse & Expand > Q&A | 토론

본문 바로가기

Wijmo

Q&A | 토론

PureJS Group Column 전체 Collapse & Expand

페이지 정보

작성자 그리드 작성일 21-04-08 17:11 조회 59회 댓글 0건
제품 버전 : 5.20202.732
컨트롤 이름 : Column, FlexGrid

본문



안녕하세요.


그리드 구현과 관련하여 몇 가지 질문을 드리고 싶습니다. 



1. 그리드 내 Group Column의 전체 Collapse & Expand


페이지 내에 'Collapse All' & 'Expand All'과 같이 별도 버튼을 두어 

전체 Group Column 을 한 번에 Collapse, Expand 제어 하고 싶습니다.

API 도큐먼트에는 로우에 대한 레벨 단위 제어 메소드만 발견할 수 있었는데, 혹 방법이 있을지요?


 

2. min 프로퍼티 값 기준 InputDate 캘린더 초기화

현재 한 행의 각 셀마다 다른 연도 min/max 값을 가져가는 Calendar 출력이 필요합니다. 

실제 날짜 선택 시 min 값이 아닌 당해 연도 기준으로 달력 페이지가 출력 되어

사용자가 실제 입력 가능한 연도로 별도 이동을 해야 합니다.


혹시 이를 제어할 다른 방법이 있을지요?


(또한 min 값이 당해 연도보다 3~4년 정도 이후일 경우 

next, previous 버튼이 작동되지 않는 현상도 간혹 발생하는데 해결 방법이 있을까요?)   


감사합니다.


 

  

  • 페이스북으로 공유
  • 트위터로  공유
  • 구글플러스로 공유
  • 카카오톡으로 보내기

댓글목록

등록된 댓글이 없습니다.

2 답변

PureJS Re: Group Column 전체 Collapse & Expand

페이지 정보

작성자 GCK루시 작성일 21-04-13 16:35 댓글 0건

본문

안녕하세요 그레이프시티입니다.


1. 그리드 내 Group Column의 전체 Collapse & Expand

=> 해당 기능을 구현하기 위해서열 그룹의 축소 여부를 결정하는 isCollapsed 속성 값을 반복문을 통해 변경해주셔야 합니다. 그 다음, 변경된 값을 그리드의 columGroups 속성에 재할당하시면 됩니다. 아래 코드는 확장 버튼을 클릭했을 때, 열 그룹의 축소를 false 값으로 할당해 전체를 expand해주는 코드입니다.


 document.getElementById("expand").addEventListener("click", (e) => {
    colGroups1.map((group) => {
      console.log(group);
      if (group.collapseTo) {
        group.isCollapsed = false;
      }
    });
    theGrid.columnGroups = colGroups1;
  });


자세한 코드는 아래 샘플에서 확인하실 수 있습니다.



[isCollapsed]

https://demo.grapecity.co.kr/wijmo/api/classes/wijmo_grid.columngroup.html#iscollapsed 


관련 도움말 문서를 함께 전달 드리오니 참고하시길 바랍니다.



2. min 프로퍼티 값 기준 InputDate 캘린더 초기화

=> 문의와 관련하여 현재 본사 개발팀과 함께 확인 중에 있습니다. 업데이트 건이 있는 대로 바로 공유 드리도록 하겠습니다. 답변이 늦어지는 점 죄송합니다.


다른 궁금한 점이 생기면, 언제든 문의 주시기 바랍니다.



감사합니다. 

그레이프시티 드림 


* 그레이프시티(GrapeCity)는 개발자를 위하여 ComponentOne(컴포넌트원), Spread(스프레드), ActiveReports(액티브리포츠), SpreadJS(스프레드JS), Wijmo(위즈모)와 같은 엑셀 스프레드시트 리포팅 그리드와 차트 등 다양한 종류의 .NET JavaScript(자바스크립트) 컴포넌트 툴을 생산하고있는 개발툴 전문 회사 입니다.



댓글목록

등록된 댓글이 없습니다.

PureJS Re: Group Column 전체 Collapse & Expand

페이지 정보

작성자 GCK루시 작성일 21-04-15 17:36 댓글 0건

본문

안녕하세요 그레이프시티입니다.


2번 문의

=> 먼저, 셀이 편집 모드에 들어갈 때 발생하는 beginningEdit 이벤트를 이용하여 각 셀 마다 inputDate 컨트롤의 min/max 값을 설정하실 수 있습니다. 자세한 코드는 아래 샘플에서 참고하시길 바랍니다.




다만, 날짜 셀을 클릭 한 후, 나오는 datePicker의 날짜는 현재 연도이고  min/max 내로 즉 선택 가능한 날짜 범위로 사용자가 직접 이동해야 하는 경우를 말씀하시는 거라면, 안타깝게도 Wijmo InputDate 컨트롤 설계상 달력 표시를 minDate 보다 이전 또는 maxDate 이후로 나오게끔 설정할 수 가 없다고 합니다. 원하시는 답변을 드리지 못한 점 죄송합니다.


[beginningEdit]

https://demo.grapecity.co.kr/wijmo/api/classes/wijmo_grid.flexgrid.html#beginningedit 


관련 도움말 문서를 전달 드리오니 참고하시길 바랍니다.


다른 궁금한 점이 생기면, 언제든 문의 주시기 바랍니다.



감사합니다. 

그레이프시티 드림 


* 그레이프시티(GrapeCity)는 개발자를 위하여 ComponentOne(컴포넌트원), Spread(스프레드), ActiveReports(액티브리포츠), SpreadJS(스프레드JS), Wijmo(위즈모)와 같은 엑셀 스프레드시트 리포팅 그리드와 차트 등 다양한 종류의 .NET JavaScript(자바스크립트) 컴포넌트 툴을 생산하고있는 개발툴 전문 회사 입니다.


댓글목록

등록된 댓글이 없습니다.

그레이프시티 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기
그레이프시티 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기
이메일 : sales-kor@grapecity.com | 전화 : 1670-0583 | 경기도 안양시 동안구 시민대로 230, B-703(관양동, 아크로타워) 그레이프시티(주) 대표자 : 허경명 | 사업자등록번호 : 123-84-00981 | 통신판매업신고번호 : 2013-경기안양-00331 Copyright ⓒ 2021 GrapeCity inc.