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

아코디언 문제 > Q&A | 토론

본문 바로가기

ReactJS 아코디언 문제

페이지 정보

작성자 포플러나무 작성일 2021-10-07 17:56 조회 3,205회 댓글 0건
제품 버전 : 알수없음

본문

안녕하세요 위즈모 리액트 아코디언을 사용하고 있습니다. 

현재 아코디언을 이용해서 데이터를 보여주는 걸 하고 있는데 클릭을 단순히 아코디언을 클릭하는게 아니라

아코디언 헤더안에 버튼을 생성하게 해서 열기, 닫기를 하려고 합니다.

그럼 기존아코디언헤더는 inactivate해주고 버튼클릭했을때만 열리게 하고싶은데 어떻게 해야할까요? 

추가적으로 라디오버튼이나 다른액션버튼을 넣으니 이벤트가 2번 동시에 발생해서 문제가 발생합니다 ( 아코디언열기x 라디오버튼이나 다른액션버튼액션만 발생해야함)


두번째로는 다른곳에 버튼을 만들어서 한꺼번에 아코디언 열기, 닫기가 가능한 버튼을 만들고 싶습니다.


데모주실 수 있으시면 데모 부탁드립니다.  

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

댓글목록

등록된 댓글이 없습니다.

3 답변

ReactJS Re: 아코디언 문제

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

페이지 정보

작성자 GCK루시 작성일 2021-10-12 11:14 댓글 0건

본문

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


문의 주신 내용과 관련하여 답변 드립니다.

먼저 Wijmo에서 아코디언 창을 확장/축소할 수 있는 직접적인 속성 및 메서드를 안타깝게도 별도로 지원하지 않고 있습니다. 다만, 아래와 같은 방식으로 해당 기능들을 수행할 수 있습니다.


1. 아코디언 헤더안에 버튼을 생성하게 해서 열기, 닫기를 하려고 합니다.

=> DOM 요소를 사용하여 헤더에 버튼을 추가하고 아코디언의 클릭 이벤트를 처리하여 추가된 버튼을 클릭할 때만 창을 확장/축소 기능을 추가하실 수 있습니다.


2. 두번째로는 다른곳에 버튼을 만들어서 한꺼번에 아코디언 열기, 닫기가 가능한 버튼을 만들고 싶습니다.

=> 각 요소에 대해 반복하여 창을 확장/축소 하기 위한  click 작업을 구현하시면 됩니다.


자세한 코드는 아래 샘플을 참고하여 주시기 바랍니다.




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


감사합니다. 

그레이프시티 드림 


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

댓글목록

등록된 댓글이 없습니다.

ReactJS Re: 아코디언 문제

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

페이지 정보

작성자 포플러나무 작성일 2021-10-12 15:08 댓글 0건

본문

안녕하세요 주신 데모 잘 보았습니다.

위즈모 아코디언 헤더 위에 multiple radio button(위즈모 라디오버튼 x, 일반 라디오버튼 o) 을 생성하게 되면 클릭시 이벤트전파막는걸 사용해도 작동이 안됩니다. 

버튼이 전부다 클릭되는 현상 (라디오버튼이 2개 있으면 두개  다 클릭되는 현상 발생) 이 발생합니다. 

라디오버튼클릭시 버튼은 정상적으로 클릭되게 하되 아코디온 열림 닫힘에 영향이 없게 만들고 싶습니다. 


해결방법 부탁드립니다. 


댓글목록

등록된 댓글이 없습니다.

ReactJS Re: 아코디언 문제

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

페이지 정보

작성자 GCK루시 작성일 2021-10-13 11:21 댓글 1건

본문

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


문의 주신 내용과 관련하여 안타깝게도 저희 쪽에서 재현이 되지 않아 정확한 원인 파악이 어려운 상황입니다. 가능하시다면 저희 쪽으로 재현 및 디버깅이 가능한 샘플을 공유해 주실 수 있으실까요? 또는 제가 이전에 공유 드린 샘플에서 라디오 버튼을 추가하여 해당 현상이 나타나는지 확인 후, 샘플 및 정확한 시나리오를 공유해주신다면 재현 및 디버깅 후 도움을 드릴 수 있도록 하겠습니다.


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


감사합니다. 

그레이프시티 드림 


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

댓글목록

GCK루시님의 댓글

GCK루시 작성일

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

문의와 관련하여 추가적인 회신 사항이 없어 완료 처리 되었습니다.
추가적인 문의 사항이 있으신 경우, 원활한 답변을 위해 새로운 Q&A 글을 생성하여 주시기 바랍니다.

감사합니다.
그레이프시티드림

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