일반적인 HTML 에서 form 값을 검증하여 글 입력시..
해당 엘리먼트를 JavaScript 로 검증후 alert() 창을 띄우고 focus 를 잡아주는게 일반적일 것이다.
이와 같은 방식을
FLEX 에서 구현하려고 하였으나 문제가 발생하였다.
Alert.show() 메서드 호출후 setFocus() 메서드를 호출하였으나..
JavaScript 의 메커니즘(?)처럼 alert가 뜰시에 다음 로직이 사용자 반응이 있기까지 대기를 하고 있는 상태라면..
이녀석은 그렇지 않다.
바로 하위로직 alert가 뜨던 말던 바로 하위 로직을 실행 시켜버린다.
즉,
Alert.show("제목 입력하세요");
Component.setFocus();
// Alert.show(alert 창 띄워짐) ->*.setFocus(); 적용 및 하위로직 수행 -> 사용자가 "확인" 버튼 클릭
// 사용자가 확인 버튼 누른 순간 focus 는 사용자가 클릭한 버튼으로 이동해버리게 됨
위와 같은 소스가 있다면, Alert 창이 사용자 반응을 기다리는게 아니라 바로 하위 소스를 실행 시켜버리게 된다.
주석을 달아놓은것과 같은 흐름이 펼쳐지게 되므로 focus를 잃어버리게 된다.
어떻게 해결할까?
해결방법은 크게 두가지다.
첫째, callLater() 메서드를 이용하는 방법.
둘째, Alert.show() 메서드의 CloseEvent를 이용하는 방법.
개인적으로 여기서 한가지 말을 하자면..
나는 사실 아직 완벽하게 callLater 메서드를 이해한것은 아니다.
자세한걸 원한다면
이 링크를 참조하길 바란다.
대략적으로 설명을 하자면..
모든 로직이(라이프 싸이클이라고 하는거 같다) 끝난뒤에 callLater 에 등록된 메서드를 호출 시키는 것이다.
(라이프싸이클을 컨트롤 한다고 하는거 같은데..자세한건 검색)
이게 정확히 맞는 설명인지는 모르겠지만,
작동방식을 테스트해본 결과..
모든 로직이 끝나고 나면..callLater 메서드에 등록된 함수(메서드)를 호출한 후에 그 함수의 로직이 끝나면,
마지막 로직이 끝난 부분으로 되돌리는거 같다..(확실한게 아니니 신뢰하지 말 것)
여튼 callLater 메서드를 이용한 해결방법을 설명 하자면,
callLater(Alert.show, ["Alert Title"]);
//callLater(method:Function, args:Array):void
id.setFocus();
이와 같은 코드로 해결 할 수 있다. (실제 내가 만든 게시판이 이런식으로 되어있다)//callLater(method:Function, args:Array):void
id.setFocus();
두번째 방법으로 Alert.show 메서드의 CloseEvent 방법을 이용하는 방법으로는,
Alert.show("message", null, 4, null, closeTest);
public function closeTest(event:CloseEvent):void{
id.setFocus();
}
이와 같은 코드로 해결 할 수 있다.id.setFocus();
}
Alert.show 메서드의 파라미터에 대한 자세한 내용은 레퍼런스를 참고 하도록 하자.
mx.controls 패키지 밑에 Alert 클래스에 나와있다.
이올린에 북마크하기
