.NET Board

lecture Home > ASP.NET > 악꽁이의 ASP.NET 강의

악꽁이의 ASP.NET 강의

강좌 최초 작성일 : 2002년 05월 20일
강좌 최종 수정일 : 2002년 05월 28일

강좌 읽음 수 : 회

작성자 : acggongi(임 태영)
편집자 : Taeyo(김 태영)

강좌 제목 : Label, TextBox, Hyperlink Controls

강좌 전 태오의 잡담>

드뎌.. 월드컵이 시작됩니다.. 프랑스와 거의 대등한 경기를 한 우리나라... 이번엔 16강을 정말로 오를 수 있을 것 같습니다. 달려라..

강좌 시작 >

Label WebServer Control

Label 웹 서버 컨트롤은 텍스트를 Web Forms 페이지에 출력할 때 사용된다. 일반적으로 단추 클릭에 대한 응답과 같이 런타임에 페이지의 텍스트를 변경할 경우 Label 컨트롤을 사용한다. 페이지에 표시되는 텍스트가 정적이고 사용자가 편집할 수 없기 때문에 텍스트만 표시할 경우 Text Box 컨트롤 또는 기타 컨트롤보다 Label 컨트롤을 사용하는 것이 효율적이다.

<asp:Label id="컨트롤 ID" Text="출력할 텍스트" runat="server"/>

또는

<asp:Label id="컨트롤 ID" runat="server"> Text </asp:Label>

예제 1) 마우스 포인터의 좌표 알아내기

ImageButton 웹서버 컨트롤과 Label 웹서버 컨트롤을 추가한 후 소스 코드를 마무리 했다. 결과를 먼저 보면...

이미지 버튼을 클릭하면 이미지 버튼에 대한 위치정보를 Label에 출력하는 예제이다. 소스는 두가지로 하나는 OnClick 속성을 사용한 소스와 코드비하인드를 이용한 코드이다. 결과는 동일하며 여기서 한가지 중요한 인수에 대해 설명하면...

Button_Click(ByVal sender As Object, ByVal e As ImageClickEventArgs)

닷넷으로 개발을 하다 보면 위와 같은 타입의 "인자가 전달된다" 말을 수시로 접하게 된다. 우리가 작성하게 될 Label 예제 또한 이에 해당이 되는데, 앞을 object 타입으로 받는 첫번 째 인자는 ImageButton(객체)를 의미하며, 두번 째로 전달되는 인자는 해당 정보가 전달이 된다. 여기서는 클릭된 위치 정보가 전달된는 것이다. 그러므로 OnClick 또는 코드비하인드를 이용 작성하더라도 이벤트가 저장된 위치(*.aspx냐 *.vb냐 *.cs냐)만 다를 뿐 그 형태는 동일하게 된다.
첫번 째 소스는 웹폼에 작성된 코드이다.

두번 째 소스는 코드비하인드 파일을 이용하여 작성된 예제이다.

예제 2) 서버 시간 출력하기

TextBox WebServer Control

TextBox 컨트롤은 웹폼에서 사용자로부터 텍스트나 숫자, 날짜 같은 정보를 입력받을 때 사용하는 컨트롤이다. Html 서버 컨트롤인 HtmlInputText 컨트롤과 비슷한 용도로 사용되지만 웹서버 컨트롤이 가지는 보다 많은 기능을 제공한다.

<asp:TextBox id="컨트롤 ID"
AutoPostBack="True|False"
Columns="컬럼 수"
MaxLength="최대 문자 길이"
Rows="행 수"
Text="텍스트"
TextMode="Single | Multiline | Password"
Wrap="True|False"
OnTextChanged="이벤트 핸들러 명"
runat="server"/>

<TextMode>

단행(Single-Line)	한 줄의 정보를 입력할 수 있는 텍스트 상자를 표시. 필요에 따라 입력할 수 있는 문자 개수를 제한할 수 있다.
다행(Multi-Line)	여러 줄을 입력할 수 있고 자동 줄 바꿈이 지원되는 텍스트 상자를 표시.
암호(Password)	한 줄 TextBox 컨트롤과 비슷하지만 사용자가 입력한 문자를 별표(*)로 처리하여 숨김.

TextBox 웹서버 컨트롤은 OnTextChange 이벤트를 가지고 았는데 AutoPostBack Property에 따라 이벤트 처리기가 호출되는 시점이 달라진다. AutoPostBack Property이란 텍스트 값의 변화가 발생하면 서버로 바로 전송하게 할 건지를 결정할 수 있다. 예를 들어 회원 가입이 되어 있는 사이트에 개인정보 수정을 할 경우 우리는 메일 주소등을 바꿀 수 있는데 일반적인 웹 로직은 페이지의 수정을 가한뒤 버튼을 클릭하여 변경된 부분을 Update하게 된다. 하지만 AutoPostBack Property는 버튼의 클릭 없이 TextBox의 포커스 이동시 즉시 변경 사항을 서버에 전송하게 되는 것이다.

예제 1) AutoPostBack 이해하기.

앞서서 AutoPostBack이란 컨트롤의 포커스 이동시 변경된 사항을 그 즉시 서버로 전송하여 페이지가 다시 Load 된다고 말했다. 기본값은 False이며 이를 속성탭 또는 Html 편집 모드에서 True로 설정해 주면 된다. 컨트롤을 세개 배치했다. TextMode는 차례로 Single, Password, MultiLine을 사용하였으며, Single과 Password로 설정된 컨트롤의 AutoPostBack을 True로 설정했다. 웹폼은 다음과 같이 디자인했다.(다소 디자인이 허접해도 이해해주세용...)

AutoPostBack 속성을 True로 설정을 하면 포커스 이동시 자동으로 서버로 값을 전송하고 페이지를 다시 Load 하게 된다고 말했다. 그러므로 True로 설정된 컨트롤은 Page_Load 이벤트 핸들러를 사용하여 이벤트를 발생시켰으며, AutPostBack을 기본값(False)로 사용한 컨트롤은 button의 Click 이벤트 핸들러에서 처리하도록 코딩했다.

결과를 확인해 보셨나요? AutoPostBack이 True로 설정되면 포커스 이동하기가 무섭게 페이지가 다시 Load된다는 걸 확인하셨을 겁니다. 아마 특별한 목적이 아닌 이상 이 속성을 설정하면 서버에게 피로회복제라도 먹여야 되지 않을까하는 생각이 듭니다.

HyperLink WebServer Control

HyperLink 웹서버 컨트롤은 프로그램적으로 접근이 가능한 웹페이지에 링크를 생성하는 컨트롤이다.

<asp:HyperLink id="컨트롤 ID"
NavigateUrl="이동할 URLl"
Text="하이퍼링크 텍스트"
ImageUrl="이미지 경로"
Target="window"
runat="server"/>

또는

<asp:HyperLink id="HyperLink1"
NavigateUrl="url"
ImageUrl="url"
Target="window"
runat="server">
Text
</asp:HyperLink>

이 컨트롤의 가장 큰 특징은 웹 어플리케이션의 서버 코드 상에서 링크의 속성을 설정 할 수 있단는 것이다. 예를 들어 페이지에서 링크에 사용될 텍스트나 Target의 설정을 변경할 수 있으며, 데이터베이스와 연동해서 링크될 페이지나 기타 속성값을 자동으로 생성 할 수 있다.
HyperLink 웹서버 컨트롤은 웹페이지에 동적으로 링크를 생성할 수 있으며, 링크를 이미지로 표시하기 위해서는 ImageUrl Property를 이용하여 이미지의 경로를 설정하면 되고, 링크를 문자열로 표현하기 위해서는 Text 속성을 설정하면 된다. 만약 두가지 속성이 모두 설정되어 있으면 ImageUrl 속성이 Text 속성에 우선하여 그림이 표시된다.
NavigateUrl은 이동할 페이지나 북마크의 경로를 설정한다.

이번 강좌는 여기서 마치겠습니다.

Back