레이아웃 데피니션 부분 공유 드립니다
,layoutDefinition: [ { header: 'FAM', colspan: 10, cells: [ //첫번째줄 { binding: 'SEL_CHECK', rowspan: 2, dataType: 'Boolean', header: '', width: '2*', minWidth: 35, align: "left", isRequired: false} ,{ binding: 'R_NUMBER', rowspan: 2, header: 'No', width: '2*', minWidth: 8, align: "center", isReadOnly: true } ,{ binding: 'FAM_JOIN', header: '연말정산<br>관계', width: '6*', minWidth: 70, dataMap: gridMap4, align: "left", isRequired: false} ,{ binding: 'FAM_NAME', colspan: 2, header: '성명', width: '4*', minWidth: 30, align: "left", isRequired: false} ,{ binding: 'FAM_AGE', dataType: 'Number', header: '나이', width: '3*', minWidth: 10,mask:"000", align: "center", isRequired: false} ,{ binding: 'GIBON_CHK', header: '기본공제', width: '3*', minWidth: 55, dataMap: gridMap5, align: "left", isRequired: false} ,{ binding: 'WOMAN_CHK', header: '부녀자', width: '3*', minWidth: 55, dataMap: gridMap5, align: "left", isRequired: false} ,{ binding: 'AGED_CHK', header: '경로<br>우대<br>(70세)', width: '4*', minWidth: 35, dataMap: gridMap5, align: "left", isRequired: false} ,{ binding: 'SUPP_CHK', header: '자녀', width: '3*', minWidth: 55, dataMap: gridMap5, align: "left", isRequired: false} //두번째줄 ,{ binding: 'NATION_GUBUN', header: '내/<br>외국인', width: '4*', minWidth: 40, dataMap: gridMap3, align: "center", isRequired: false} ,{ binding: 'REG_NUM_TYPE', header: '주민(외국인)<br>등록번호', width: '4*', minWidth: 40, dataMap: gridMap11, align: "left", isRequired: false} ,{ binding: 'JUMIN_NO', header: '주민(외국인)<br>등록번호', width: '7*', minWidth: 60, mask: "000000-0000000", align: "center", isRequired: false , editor: new wijmo.input.InputMask(document.createElement("div"), { isRequired: false, value: null, mask: '000000-0000000'}) } ,{ binding: 'INCOME_STD_EX', header: '소득<br>기준<br>초과', width: '3*', minWidth: 55, dataMap: gridMap5, align: "left", isRequired: false} ,{ binding: 'HOUSE_HOLD_YN', header: '세대주', width: '4*', minWidth: 45, dataMap: gridMap9, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'SINGLE_CHK', header: '한부모', width: '3*', minWidth: 55, dataMap: gridMap5, align: "left", isRequired: false} ,{ binding: 'DEFORM_GRADE', header: '장애인', width: '5*', minWidth: 70, dataMap: gridMap6, align: "left", isRequired: false} ,{ binding: 'CHILD_NO', header: '당해<br>출산<br>입양', width: '4*', minWidth: 55, dataMap: gridMap7, align: "left", isRequired: false} ] }, { header: 'FAM_DATA', colspan: 25, cells: [ //첫번쨰줄 { binding: 'N_GUBUN', rowspan: 2, header: '구분', width: '2*', minWidth: 8, align: "center", isReadOnly: true } ,{ binding: 'N_HINSUR_AMT', header: '보험료', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_HIRE_AMT', header: '보험료', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_INSUR_AMT', header: '보험료', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_DINSUR_AMT', header: '보험료', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_CM_MED_AMT', header: '의료비', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_IFT_MED_AMT', header: '의료비', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_ICB_MED_AMT', header: '의료비', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_AGE_MED_AMT', header: '의료비', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_MED_EXP_AMT', header: '의료비', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_EDU_TYPE', header: '교육비', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_CM_EDU_AMT', header: '교육비', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_DEFORM_EDU_AMT', header: '교육비', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_CARD_AMT', header: '신용카드등', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_CHECK_AMT', header: '신용카드등', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_CASH_AMT', header: '신용카드등', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_CULT_AMT', header: '신용카드등', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_TRD_AMT', header: '신용카드등', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_F_TP_AMT', header: '신용카드등', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_S_TP_AMT', header: '신용카드등', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_PRE_TOT_AMT', header: '신용카드등', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_PRE_TRD_AMT', header: '신용카드등', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_CUR_TOT_AMT', header: '신용카드등', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_CUR_TRD_AMT', header: '신용카드등', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'N_GIFT_AMT', header: '기부금', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} //두번째줄 ,{ binding: 'E_HINSUR_AMT', header: '건강', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_HIRE_AMT', header: '고용', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_INSUR_AMT', header: '보장성', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_DINSUR_AMT', header: '장애인<br>전용', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_CM_MED_AMT', header: '일반', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_IFT_MED_AMT', header: '난임', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_ICB_MED_AMT', header: '미숙아<br>선천성<br>이상아', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_AGE_MED_AMT', header: '65세이상<br>장애인<br>건보산정', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_MED_EXP_AMT', header: '실손', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_EDU_TYPE', header: '구분', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_CM_EDU_AMT', header: '일반', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_DEFORM_EDU_AMT', header: '장애인<br>특수', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_CARD_AMT', header: '신용카드', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_CHECK_AMT', header: '직불카드등', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_CASH_AMT', header: '현금영수증', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_CULT_AMT', header: '도서공연등<br>(총급여<br>7천만원이하)', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_TRD_AMT', header: '전통시장', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_F_TP_AMT', header: '대중교통<br>(1월~6월)', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_S_TP_AMT', header: '대중교통<br>(7월~12월)', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_PRE_TOT_AMT', header: '2021년<br>전체', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_PRE_TRD_AMT', header: '2021년<br>전통시장', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_CUR_TOT_AMT', header: '2022년<br>전체', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_CUR_TRD_AMT', header: '2022년<br>전통시장', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ,{ binding: 'E_GIFT_AMT', header: '기부금', width: '4*', minWidth: 45, align: "center", isRequired: false, isReadOnly: true} ] } ]
추가적으로 FlexGrid 처럼 컬럼을 안보이게 visible: false 처리 할수 없는지 질문드립니다.
등록된 댓글이 없습니다.
안녕하세요 그레이프시티입니다.
먼저 답변이 지연되어 죄송합니다.
문의 주신 내용에 대해 다음과 같이 답변 드립니다.
1. MultiRow 컨트롤에서 rowspan 속성 설정 시 열 헤더의 데이터가 상단에 위치하는 현상
MultiRow 컨트롤을 이용하여 기존의 그리드의 레이아웃을 확장하는 경우, 기본적으로 셀의 데이터는 중앙에 표시됩니다.
말씀하신 현상과 같이 열 헤더의 데이터가 상단에 위치하시는 경우, 아래의 코드를 이용하여 열 헤더의 데이터의 위치를 설정해보시기 바랍니다.
.wj-multirow .wj-colheaders .wj-cell.wj-center-vert:not(.wj-hasdropdown) div { vertical-align: center !important; }
2. MultiRow 컨트롤의 특정 열의 visible 속성을 false로 설정하는 방법
아쉽게도 MultiRow 컨트롤은 visible 속성을 지원하지 않습니다.
이와 관련하여 아래의 API 문서를 첨부해 드리오니 확인해 보시기 바랍니다.
본사 개발 팀을 통하여 MultiRow 컨트롤의 특정 열을 숨기는 방법에 대해 확인 중에 있으며, 확인 되는 대로 답변 드리도록 하겠습니다.
답변이 지연되어 죄송합니다.
다른 궁금한 점이 생기면, 문의 주시기 바랍니다.
감사합니다.
그레이프시티 드림
등록된 댓글이 없습니다.
안녕하세요 그레이프시티입니다.
먼저 답변을 오래 기다리게 해드려 죄송합니다.
문의 주신 MultiRow 컨트롤의 특정 열을 숨기는 방법에 대해 답변 드립니다.
MultiRow 컨트롤의 layoutDefinition 속성을 이용하여 특정 열에 해당하는 셀들을 splice 메서드를 사용해 제거하여 특정 열을 숨길 수 있습니다.
아래의 샘플을 참고해 주시기 바랍니다.
샘플은 다음과 같은 방법으로 구현되었습니다.
API 문서를 공유드리며 다른 궁금한 점이 생기면, 문의 주시기 바랍니다.
감사합니다.
그레이프시티 드림
등록된 댓글이 없습니다.