ASP.NET AJAX : UpdatePanel 사용시에 Trigger가 ControlID를 찾을 수 없는 경우

오늘 회사에서 한 1~2시간 동안 헤메였던 문제였다. 뭐든 다 그렇듯 생각보다 방법은 엄청 쉬웠다는게 좀 -_-;; 일단 이번 문제를 해결하면서 왠지 조금은 ASP.NET 에 대해서 이해를 하기 시작했다고 해야하나.. 암튼 그런게 좀 있다 -_-;; 여튼 한번 상황을 정리 해보자면 이러하다..

<상황>

비동기식으로 되어있었던 DropDownList 를 UpdatePanel / Trigger 의 AsyncPostBackTrigger 로 등록하고자 했다. 이유인 즉슨 DropDownList 두개를 등록해서 하나는 대분류, 하나는 소분류의 형태로 만들고자 했기 때문이다.

위와 같은 형태로 말이다.. 좌측의 List (대분류) 를 선택하면 그에 해당되는 목록이 나오는 우측의 List를 만들기 위함이었다. 비동기식으로 만들어버리는 UpdatePanel 속에 있으니 OnSelectedIndexChanged 라는 속성이 작동하지 않았기 때문에 이 해당 Control만 동기식으로 변경하도록 변경하고자 했다.

---

<문제>

1. <Triggers>  
2.             <asp:AsyncPostBackTrigger ControlID="linkBtn" EventName=""/>  
3.             <asp:AsyncPostBackTrigger ControlID="highLevelTroubleType" EventName="SelectedIndexChanged"/>  
4.             <asp:AsyncPostBackTrigger ControlID="lowLevelTroubleType"/>  
5.         </Triggers>  

위처럼 Trigger를 등록했다. ControlID를 아주 올바르게 썼으며.. LOG로 출력해보았을때도 ID는 분명 상기에 기재한것과 동일했다. 하지만 아래처럼 (InvalidOperationException 발생 후덜덜 ㅠㅠ) 찾을 수 없는 컨트롤이라는 메시지가 나왔는데, 여러가지 추측을 해봤었다. 그중에서 페이지 로드를 하면서 Control을 생성하는 도중에 문제가 생기는 거라고 생각했지만 전혀 관계 없는 추측이었다. 한 시간정도 서핑을 해본 끝에 뭔가 얻은 아이디어가 하나 있었는데, 비슷한 Issue 들이 있어서 포럼을 통해 의견을 나눈 예제들을 살펴보면 구조적으로 좀 다른 형태를 띠고 있었다.

---

 
<해결>

위의 linkBtn 이라는 ControlID를 가진 컨트롤은 UpdatePanel의 '직속 자식' Control 이었다. 하지만 내가 정의한 highLevelTroubleType 은 UpdatePanel 의 자식 Control 인 GridView 에 속하는 '손자' 형태의 Control 이었다. 살펴보면 linkBtn 만 정상적으로 작동하는게 이상하기도 하다. 그래서 이와 관련하여 몇가지 조회를 해보니, '손자' ControlID를 표현하는 방식이 따로 있었다. 그래서 변경된 Trigger 태그의 모습은 아래와 같다.

1. <Triggers>  
2.     <asp:AsyncPostBackTrigger ControlID="linkBtn" EventName=""/>  
3.     <asp:AsyncPostBackTrigger ControlID="DetailsView1$highLevelTroubleType" EventName="SelectedIndexChanged"/>  
4.     <asp:AsyncPostBackTrigger ControlID="DetailsView1$lowLevelTroubleType"/>  
5. </Triggers>  

이렇게 올바른 ControlID 를 심어주게 되면 정상적으로 컴파일이 되어 작동한다. 처음에는 오타를 친줄 알고 열심히 철자를 검사하고 있었는데.. 어찌보면 오타가 맞다. 뭔가 ASP.NET 의 컨트롤들의 구조를 제대로 이해하지 못하고 있었던 탓이기도 하니까...

여튼 ASP.NET을 조금씩 알아가는거 같다.. 오늘도 하나 배움요..