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

행 단위 동적 Editor 적용 시 가이드 문의 드립니다. > Q&A | 토론

본문 바로가기
로그인

로그인후 이용해주세요

아직 회원이 아니신가요?

회원가입
로그인
MESCIUS 카카오톡 채널 추가
메시어스 +
카카오톡 채널 추가를 통해 MESCIUS의 최신 정보, 이벤트, 세미나 정보를 빠르게 받아 보실수 있습니다
홈 링크 페이스북 링크 유튜브 링크

Wijmo

Q&A | 토론 - VueJS

VueJS 행 단위 동적 Editor 적용 시 가이드 문의 드립니다.

페이지 정보

작성자 우가
프로필 보기 쪽지 보내기
작성일 2023-09-07 11:57 조회 660회 댓글 0건
제품 버전 : 5.20221.857
컨트롤 이름 : AutoComplete, InputNumber

본문

안녕하세요. 


prepareCellForEdit  이벤트 발생 시점에 동적으로 Editor 컨트롤을 바인딩 하려고 아래 코드와 같이 적용하였습니다. 

다음과 같이 적용하면 아래 문제들이 발생합니다.

1. 이미 위즈모 그리드의 기본 Editor가 존재하여 Editor가 중첩되는 현상

2. 기존 Editor를 삭제하면 포커스 이동이 되지 않아 강제로 포커스를 적용해야 하는 현상

3. 강제 포커스 적용 후, Editing 진입 시 첫 번째 입력 값이 block 처리되어 두 번째 입력 값부터 들어가는 현상


현재는 위 문제점을 잡기 위한 처리를 해두었지만,  동적으로 Editor를 바인딩 하기 위한 더 나은 방법에 대해 문의 드립니다.

1. 아래에 작성한 코드 대신에 prepareCellForEdit 이벤트를 적용하는 데에 있어 가이드 제공 부탁 드립니다.

2. 현재는 prepareCellForEdit 이벤트에서 적용하고 있는데, 더 좋은 적절한 이벤트가 있는 지도 궁금합니다.


감사합니다.


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

댓글목록

등록된 댓글이 없습니다.

3 답변

VueJS Re: 행 단위 동적 Editor 적용 시 가이드 문의 드립니다.

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

페이지 정보

작성자 GCK루시
프로필 보기 쪽지 보내기
작성일 2023-09-11 10:21 댓글 0건

본문

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


문의하신 이슈의 경우, Wijmo FlexGrid의 기본 구조를 사용하는 것이 아닌 사용자 정의한 기능을 이용함에 따라 이슈가 발생된 것으로 확인됩니다. 더불어 기본 editor를 숨김처리하는 것이 아닌 removeChild과 같이 editor를 삭제해버리는 경우에는 더욱 더 예상치 못한 결과를 불러올 수 있으니 아래 코드와 같이 단순히 숨김처리해주시기 바랍니다.


  if (s.activeEditor) {
    var parentCell = s.activeEditor.parentElement;
    parentCell.style.paddingLeft = '0px';
    parentCell.style.paddingRight = '0px';
    //attach custom editor
    parentCell.insertBefore(rootEl, s.activeEditor);
    control.focus();

    if (!wijmo.isUndefined(control['text'])) {
      control['text'] = s.activeEditor.value;
    } else {
      //do nothing
    }
  }


더불어 한 열에 여러 유형의 input을 적용하기 위한 가장 쉽고 최적화된 방법은 prepareCellForEdit 이벤트를 사용하는 것입니다.


만일 추가적으로 이슈가 발생하는 경우 해당 이슈를 재현할 수 있는 샘플을 공유해주신다면 개선 사항이 있는지 확인 후 회신드릴 수 있도록 하겠습니다.


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


감사합니다.

그레이프시티 드림


댓글목록

등록된 댓글이 없습니다.

VueJS Re: 행 단위 동적 Editor 적용 시 가이드 문의 드립니다.

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

페이지 정보

작성자 우가
프로필 보기 쪽지 보내기
작성일 2023-09-18 16:39 댓글 0건

본문

안녕하세요.

답변 감사합니다.


그런데 저희는 기존에 답변에 남겨주신 예제 코드와 같이 사용하다가 본문에 작성한 아래의 문제들이 발생하여 이를 해결하기 위해 첨부한 코드로 바꿔 적용한 상태였습니다.

1. 이미 위즈모 그리드의 기본 Editor가 존재하여 Editor가 중첩되는 현상

2. 기존 Editor를 삭제하면 포커스 이동이 되지 않아 강제로 포커스를 적용해야 하는 현상

3. 강제 포커스 적용 후, Editing 진입 시 첫 번째 입력 값이 block 처리되어 두 번째 입력 값부터 들어가는 현상



3번의 경우, 둘 중 어느 코드를 적용하여도 동일 문제가 발생합니다.

답변에 남겨주신 예제에서 기본 editor를 단순 숨김 처리하는 부분과 위의 3번에 대한 답변이 궁금하여 재문의 드립니다.  


감사합니다.

댓글목록

등록된 댓글이 없습니다.

VueJS Re: 행 단위 동적 Editor 적용 시 가이드 문의 드립니다.

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

페이지 정보

작성자 GCK루시
프로필 보기 쪽지 보내기
작성일 2023-09-20 11:11 댓글 1건

본문

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


문의하신 내용이 안타깝게도 저희 쪽에서 재현이 되지 않아 정확한 원인 파악이 어려운 상황입니다. 아래 기본 샘플을 공유드리오니 저희 쪽으로 재현 가능한 샘플을 공유주시기 바랍니다. 저희 쪽에서 재현 및 디버깅 후 답변 드릴 수 있도록 하겠습니다.


 


감사합니다.

그레이프시티 드림 

댓글목록

MESCIUS루시님의 댓글

MESCIUS루시
프로필 보기 쪽지 보내기
작성일

안녕하세요 메시어스입니다.

현재 확인 요청드린 내용에 대한 추가 회신이 없어 문의 종료 처리하겠습니다.
추가 문의가 있으신 경우, 새 Q&A글을 작성하여 문의주시기 바랍니다.

감사합니다.
메시어스 드림

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

카테고리

인기글

더보기

최신글

더보기

셀럽

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