재우니의 블로그



거두절미하고 ... ASP.NET Master Pages 와 LINQ를 이용하여 textbox 에 focus 설정하는 방법을 알아보죠.


asp.net 으로 master page 를 두고, content 페이지에 textbox 를 여러개 둡니다.


그럼 content page 의 디자인을 구현해 보죠.


<table style="width400px;">
        <tr>
            <td>성(ex:심)</td>
            <td><asp:TextBox ID="txtFirstName" runat="server" /></td>       
        </tr>
        <tr>
            <td>이름(예:재운)</td>
            <td><asp:TextBox ID="txtLastName" runat="server" /></td>
        </tr>
        <tr>       
            <td>&nbsp;</td>
            <td><asp:Button ID="btnSave" runat="server" Text="Save Data" /></td>
        </tr>

    </table>




이제 위의 textbox 들의 첫번째에 focus 를 설정하기 위해서 master page 의 코드비하인드단에 아래와 같이 기술합니다.



protected void Page_Load(object sender, EventArgs e)
        {
            var control = ContentPlaceHolder1.Controls.Cast<Control>()
                          .Where(o => o is TextBox)
                          .FirstOrDefault();
 
            if (control != null)
            {
                control.Focus();
            }

        }



LINQ 를 이용해서 content page 에 기술된 textbox 의 컨트롤을 전부 찾으며, FirstOrDefault 함수를 사용한 이유는 만약에 textbox 가 전혀 아무것도 없다면 null 로 반환하기 위해서 처리된 부분입니다. 


textbox 가 존재하는지 null 로 확인하여 존재하면 해당 control 에 focus 메소드를 이용합니다.


control.Focus();



자... 이제 페이지를 실행해 볼까요.???



이제 확인하기 위해서 랜더링된 html 태그를 ie 에서 소스보기를 이용하여 확인해 보죠.


<script type="text/xxjavascript">

 //<![CDATA[

 WebForm_AutoFocus('ctl00_ContentPlaceHolder1_txtFirstName');//]]>

</script>



소스보기를 보니 이상한 자바스크립트 함수가 뻘줌이 있습니다. 이름하여... WebForm_AutoFocus() ..


이 WebForm_AutoFocus  함수가 어디에 있으며 사용이 되어 focus 를 설정할까요?



<script src="/WebResource.axd?d=aJEJQD1ZsUmPBPzsaC59Dw2&amp;t=633628781190633238" 

type="text/xxjavascript"></script>




위와 같이 js 파일이 포함되어 있답니다. 이 부분을 다운받아 받아서 한번 보죠.



function WebForm_AutoFocus(focusId) {

    var targetControl;

    if (__nonMSDOMBrowser) {

        targetControl = document.getElementById(focusId);

    }

    else {

        targetControl = document.all[focusId];

    }

    var focused = targetControl;

    if (targetControl && (!WebForm_CanFocus(targetControl)) ) {

        focused = WebForm_FindFirstFocusableChild(targetControl);

    }

    if (focused) {

        try {

            focused.focus();

            if (__nonMSDOMBrowser) {

                focused.scrollIntoView(false);

            }

            if (window.__smartNav) {

                window.__smartNav.ae = focused.id;

            }

        }

        catch (e) {

        }

    }

}



어려운 구문이 없으니 이 부분은 여기서 언급하지 않을께요. 질문은 댓글로 요청해 주시면 감사..^^;


이제 master page 와 linq 의 합작 작품으로 focus 를 일일이 content page 에서 지정할 필요없이 간단한 구문으로 처리하는 것을 이제 아실거라 생각이 듭니다.




감사합니다.


posted by 심재운 (shimpark@gmail.com)