ASP.NET Master Pages 와 LINQ를 이용하여 textbox 에 focus 설정하기

[심재운]

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

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

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

<table style="width: 400px;">

        <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/xxxxxxjavascript">

 //<![CDATA[

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

</script>

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

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

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

type="text/xxxxxxjavascript"></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)

[Tack]

멋지네요... LINQ를 to SQL로만 사용했는데