ASP.NET 웹폼의 TextBox 기본 입력 모드(IME)를 한글로 설정 하는 방법


ASP.NET으로 웹 사이트를 개발할 때 웹 페이지에 TextBox를 배치해서 프로그램을 개발하는 경우가 많습니다.

C# 윈폼을 개발할 때와 마찬가지로 ASP.NET 웹폼에서도 Label과 TextBox는 정말 많이 사용하는 컨트롤입니다.

웹폼에서 TextBox의 기본 입력 모드(IME)는 영문입니다. 한글을 입력하기 위해서는 매번 한/영 변환키를 한번 눌러 한글 모드로 변환해 주어야 합니다.

한글 이름을 입력 받는 TextBox나 한글 주소를 입력 받는 TextBox인 경우 기본 입력 모드(IME)를 한글로 해 놓으면 한/영 변환을 매번 해줘야 하는 불편함을 해소할 수 있습니다.

떄로는 TextBox에 기본적으로 대문자를 입력 받게 하거나, 반대로 소문자를 입력 받게 하거나 할 경우에도 IME Mode를 해당 입력 모드로 설정해 놓으면 사용자에게 편리하게 입력을 유도할 수 있습니다.

이번 글에서는 ASP.NET 웹폼의 TextBox 기본 입력 모드(IME)를 한글로 설정 하는 방법에 대해 알아보겠습니다.
마지막 단락의 ime-mode 설명에서 대문자, 소문자 기본 입력 모드에 대한 설명도 확인하실 수 있습니다.

ASP.NET 웹폼의 TextBox 기본 입력 모드(IME)를 한글로 설정 하는 방법

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를 적절히 지정해서 사용하면 웹 페이지에서 텍스트를 입력할 때 조금은 편리하게 입력을 할 수 있습니다. 한/영 변환이 별것 아닌 것 같지만 사용자 입장에서는 의외로 편리하게 와 닿는 기능이기도 합니다.





이 글이 도움이 되었기를 바랍니다. ^-^


답글 남기기