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

그리드 제목 줄 바꿈 처리 > Q&A | 토론

본문 바로가기

Wijmo

Q&A | 토론

ReactJS 그리드 제목 줄 바꿈 처리

페이지 정보

작성자 토끼바람 작성일 2021-08-05 14:41 조회 4,378회 댓글 0건
제품 버전 : 5.20211.794
컨트롤 이름 : FlexGrid

본문

안녕하세요

아래와 같이 그리드 컬럼을 설정했는데요..


그리드 헤더의 줄바꿈을 처리 하고 싶습니다.


    1. [{
      1. binding"companyCode"
      2. ,header"Company"
      3. ,width150
      4. }
    2. ,{
      1. binding"divisionName"
      2. ,header"Division"
      3. ,width150
      4. }
    3. ,{
      1. align"center"
      2. ,collapseTo"dfrRate20210503w18"
      3. ,columns
        1. [{binding"dfrRate20210503w18"header"DFR"width100}
        2. ,{binding"otdRate20210503w18"header"OEF"width120}
        3. ,{binding"sriRate20210503w18"header"SRI"width120}
        4. ]

      4. ,header"2021-05-03\n (W18)"
      5. multiLinetrue
      6. wordWraptrue
      7. }
      1. ,{align"center"
      2. ,collapseTo"dfrRate20210510w19"
      3. ,columns[{…}{…}{…}]
      4. ,header"2021-05-10\n (W19)"
      5. ,multiLinetrue
      6. ,wordWraptrue
      7. }]

      8. header"2021-05-10\n (W19)"
    4. \n도 해보고 <br/>로도 해봤는데 안 먹히더라구요...
  1. 강제적 줄바꿈을 할수있는 방법이 있는지 문의 드립니다.
  2.  
  • 페이스북으로 공유
  • 트위터로  공유
  • 링크 복사
  • 카카오톡으로 보내기

댓글목록

등록된 댓글이 없습니다.

1 답변

ReactJS Re: 그리드 제목 줄 바꿈 처리

추천0 이 글을 추천하셨습니다 비추천0 채택채택

페이지 정보

작성자 GCK루시 작성일 2021-08-06 10:55 댓글 0건

본문

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


그리드의 열 헤더에 <br>과 같이 HTML을 표시하기 위해서는 formatItem 이벤트를 사용하여 셀의 innerHTML 속성을 설정해주셔야 합니다. column Header에서 HTML  설정하신 후, line break를 표시하기 위해서 열 헤더의 행을 autoSize를 통해 컨텐츠에 맞게 높이를 재조정해주시면 됩니다. 아래 코드를 확인하시길 바랍니다.

 

<FlexGrid
   initialized={initGrid}
    formatItem={formatItem}
     (..)
></FlexGrid>

function initGrid(grid) {
    grid.autoSizeRow(0, true);
    setGrid(grid);
  }


  function formatItem(s, e) {
    if (e.panel == s.columnHeaders) {
      e.cell.innerHTML = e.cell.textContent;
    }
  }


[autoSizeRow]

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


도움말 문서도 같이 전달 드리오니 참고 부탁 드립니다.


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


감사합니다. 

그레이프시티 드림 


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

댓글목록

등록된 댓글이 없습니다.

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