[Javascript] 자바스크립트 폼에서 엔터키 입력시 버튼 실행 ( Postback 일어나지 않게 )

※ Form에서 Enter Key 입력하는 경우 일어나는 일

     --> PostBack 발생 ( TextBox 수에 따라 차이점이 있음 )

 

1. TextBox 1
• 자동적으로 PostBack 발생. 이벤트 없음.
2. TextBox 1 + Button 1
• 자동적으로 PostBack 발생. 이벤트 없음
3. TextBox 2 이상 + Button 1
1. Button Click
4. TextBox 2 이상 + Button 이상
1. 첫 번째 Button Click

 

1. Javascript 생성

/**********************************************************/

' Method Name : onKeydownEnterKey (obj : 실행될 버튼 오브젝트)
' Written date : 2007/03/23
' Writter : Bo H. Choi
' Contents : Input text에서 값 입력후 엔터시 버튼실행. (포스트백 발생안함)
' Purpose : 
' Updated by :
' Updated date :
' Updated contents :
' Sample : onkeydown="onKeydownEnterKey(document.all.btnLogin)"
**********************************************************/
function onKeydownEnterKey(obj)
{

    if (event.keyCode == 13)
    {
        self.focus();
        obj.click();
        return false;
    }

}

 

2. Javascript 실행

<table width="185" border="0" cellspacing="0" cellpadding="0">
 <tr>
  <td><input name="TbUserID" onkeydown="onKeydownEnterKey(document.all.btnLogin)"  /></td>
  <td><asp:ImageButton ID="btnLogin" runat="server" ImageUrl="../img/introimg/but_login.gif" OnClick="btnLogin_Click" /></td>
 </tr>
</table>