ASP.NET으로 웹 사이트를 개발할 때 웹 페이지에 TextBox를 배치해서 프로그램을 개발하는 경우가 많습니다.
C# 윈폼을 개발할 때와 마찬가지로 ASP.NET 웹폼에서도 Label과 TextBox는 정말 많이 사용하는 컨트롤입니다.
웹폼에서 TextBox의 기본 입력 모드(IME)는 영문입니다. 한글을 입력하기 위해서는 매번 한/영 변환키를 한번 눌러 한글 모드로 변환해 주어야 합니다.
한글 이름을 입력 받는 TextBox나 한글 주소를 입력 받는 TextBox인 경우 기본 입력 모드(IME)를 한글로 해 놓으면 한/영 변환을 매번 해줘야 하는 불편함을 해소할 수 있습니다.
떄로는 TextBox에 기본적으로 대문자를 입력 받게 하거나, 반대로 소문자를 입력 받게 하거나 할 경우에도 IME Mode를 해당 입력 모드로 설정해 놓으면 사용자에게 편리하게 입력을 유도할 수 있습니다.
이번 글에서는 ASP.NET 웹폼의 TextBox 기본 입력 모드(IME)를 한글로 설정 하는 방법에 대해 알아보겠습니다.
마지막 단락의 ime-mode 설명에서 대문자, 소문자 기본 입력 모드에 대한 설명도 확인하실 수 있습니다.
HTML INPUT TAG에서의 ime-mode 설정 방법
HTML INPUT Tag에서 IME-MODE를 설정하는 방법에 대한 예제 입니다.
- Style에서 IME MODE를 지정해서 사용할 수 있습니다.
- style=”ime-mode: active”
<input type=“text” name=“kname” style=“ime-mode:active”>
|
ASP 표준 TextBox에서의 imd-mode 설정 방법
ASP.NET 표준 TextBox를 사용할 때 IME-MODE를 설정하는 방법에 대한 예입니다.
- Style에서 IME MODE를 지정해서 사용할 수 있습니다.
- style=”ime-mode: active”
<asp:TextBox ID=“txtName” runat=“server” style=“ime-mode:active”></asp:TextBox>
|
DevExpress ASPxTextBox에서의 imd-mode 설정 방법
DevExpress에서 제공하는 ASPxTextBox 컨트롤을 사용할 때 IME-MODE를 설정하는 방법에 대한 예제 입니다.
- CssClass 속성에서 css를 지정해서 사용할 수 있습니다.
- 예: CssClass=”activeIME”
*– CSS
<style type=“text/css”>
.activeIME .dxeEditArea
{
ime-mode: active;
}
</style>
*– ASPX
<dx:ASPxTextBox ID=“txtName” runat=“server” Width=“100px” CssClass=“activeIME” >
<ValidationSettings CausesValidation=“True” ErrorText=“”>
<RequiredField ErrorText=“필수” IsRequired=“True” />
</ValidationSettings>
</dx:ASPxTextBox>
|
ime-mode 종류 및 설명
▼ IME Mode의 종류와 각 모드에 대한 설명입니다.
- style=”ime-mode: auto;” : 한/영 전환해서 입력 가능
- style=”ime-mode: deactivated;” : 한/영 전환해서 입력 가능
- style=”ime-mode: disabled;” : 영문, 숫자만 입력 가능. 한/영 전환 불가능
- style=”ime-mode: active;” : 기본 한글 모드. 한/영 전환해서 입력 가능
- style=”ime-mode: inactive;” : 기본 영문 모드. 한/영 전환해서 입력 가능
- style=”text-transform: uppercase;” : 대문자 입력
- style=”text-transform: lowercase;” : 소문자 입력
결론으로, 상황에 맞게 IME Mode를 적절히 지정해서 사용하면 웹 페이지에서 텍스트를 입력할 때 조금은 편리하게 입력을 할 수 있습니다. 한/영 변환이 별것 아닌 것 같지만 사용자 입장에서는 의외로 편리하게 와 닿는 기능이기도 합니다.
※ 함께 읽으면 도움이 될 만한 다른 포스팅 글입니다.
이 글이 도움이 되었기를 바랍니다. ^-^