! 제품 버전을 정확하게 입력해 주세요.
제품 버전이 정확하게 기재되어 있지 않은 경우,
최신 버전을 기준으로 안내 드리므로
더욱 빠르고 명확한 안내를 위해
제품 버전을 정확하게 입력해 주세요!

FlexGrid에서 Excel과 유사한 다중 범위 선택 기능 사용하기 > 블로그 & Tips

본문 바로가기

FlexGrid에서 Excel과 유사한 다중 범위 선택 기능 사용하기

페이지 정보

작성자 GrapeCity 작성일 2019-07-23 10:28 조회 2,900회 댓글 0건

본문

Wijmo의 2019 v2에서는 고객들의 필요에 따라 FlexGrid에 새로운 "MultiRange"  SelectionMode를 추가했습니다 이 선택 모드를 사용하면 Excel에서와 같이 다중 범위를 선택할 수 있습니다.


FlexGrid에서 다중 범위 선택


Wijmo 2019 v2 새로운 기능 자세히 보기 


selection 속성은 선택된 셀의 단일 범위만 지원했기 때문에 이전에는 이것을 추가하지 않았습니다. 이를 개선하기 위해, 새로운 selectedRanges 속성을 추가했습니다. 이 속성은 현재 선택된 범위를 포함하는 CellRange 객체를 포함하는 배열을 가져옵니다. 현재 선택을 사용하여 Excel 형식의 동적 데이터 요약을 제공하거나 선택한 범위를 CSV 파일로 내보낼 수 있습니다.


샘플을 통해 새로운 기능을 확인하실 수 있습니다. 


클립 보드 및 내보내기 명령은 선택한 모든 범위가 동일한 열 범위 또는 동일한 행 범위를 참조하는 경우 다중 범위 선택에 대해서만 작동합니다 (Excel도 이러한 방식으로 동작합니다).


다음은 FlexGrid에서 새로운 MultiRange selectionMode를 사용하는 코드의 예입니다. selectionChanged 이벤트에서 다중 범위 선택 데이터에 액세스하는 방법도 보여줍니다.

 var theGrid = new FlexGrid('#theGrid', {  
        selectionMode: SelectionMode. MultiRange,  
        itemsSource: data,  
        // update aggregate display when selection changes  
        selectionChanged: (s, e) => {  
            // calculate aggregates  
            let agg = { cnt: 0, cntAll: 0, sum: 0, avg: 0, cells: {} };  
            s.selectedRanges.forEach(rng => {  
                aggregateRange(s, agg, rng);  
            });  
        }  
    });  


이 샘플의 전체 코드를 살펴볼 수 있습니다. 


  • 페이스북으로 공유
  • 트위터로  공유
  • 링크 복사
  • 카카오톡으로 보내기

댓글목록

등록된 댓글이 없습니다.

메시어스 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기

태그1

인기글

더보기
  • 인기 게시물이 없습니다.
메시어스 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기
이메일 : sales-kor@mescius.com | 전화 : 1670-0583 | 경기도 과천시 과천대로 7길 33, 디테크타워 B동 1107호 메시어스(주) 대표자 : 허경명 | 사업자등록번호 : 123-84-00981 | 통신판매업신고번호 : 2013-경기안양-00331 ⓒ 2024 MESCIUS inc. All rights reserved.