본문 바로가기

개발&컴퓨터/ASP & ASP.NET

ASP.NET - 텍스트박스(TextBox)에 숫자만 입력받도록 하기

반응형

방법1) ASPX 파일의 TextBox 객체에 직접 설정하기

example.aspx
<asp:TextBox ID="txtNumberData" runat="server" MaxLength="4" style="text-align:left;ime-mode:disabled;" onkeyPress="if ((event.keyCode < 48) || (event.keyCode > 57))  event.returnValue=false;" />

* ime-mode:disabled : 영문/숫자만 입력가능하도록 설정

* onkeyPress="if ((event.keyCode < 48) || (event.keyCode > 57)) event.returnValue=false;" 
 > 키보드 입력(키 눌림) 이벤트가 들어왔을 때, ASCII값이 48보다 작거나 57보다 크면 return false 처리. 즉 if 조건에 맞지 않으면 값이 입력되지 않음.

ASCII 코드 48 = 문자 "0"
ASCII 코드 57 = 문자 "9"

즉 입력된 문자값이 숫자 0 ~ 9 범위이내 인 경우만 입력 됨.

키보드 입력(키 눌림) 이벤트가 들어왔을 때, ASCII값이 48보다 작거나 57보다 크면 return false 처리. 즉 if 조건에 맞지 않으면 값이 입력되지 않음.

 

방법2) ASPX.CS 파일에서 설정하기 

example.aspx
<asp:TextBox ID="txtNumberData1" runat="server" MaxLength="4" style="text-align:left;ime-mode:disabled;">
<asp:TextBox ID="txtNumberData2" runat="server" MaxLength="4" style="text-align:left;ime-mode:disabled;">

 

example.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
    TextBox[] txtboxArray = { txtNumberData1, txtNumberData2 };
    KeyInputOnlyNumber(txtboxArray);
}

protected void KeyInputOnlyNumber(TextBox[] txtBoxList)
{
    for (int i = 0; i < txtBoxList.Length; i++)
    {
        txtBoxList[i].Attributes["onkeypress"] = "if( (event.keyCode < 48 ) || (event.keyCode > 57) ) 
{ return false; }";
    }
}

방법2도 방법1과 그 원리는 동일하나 서버측 코드에서 처리함.
또한 숫자만 입력받아야 할 TextBox 객체가 많은 경우, 한번에 처리할 수 있는 코드(함수로 작성)로 짤 수 있음.

 

 

반응형