폼 (form) 태그

<form name="폼이름" method="전송 방식" action="데이터가 전송될 페이지 주소" enctype="인코딩 타입">

입력 양식들...

</form>

name : 폼의 이름을 설정한다.

action : 입력된 결과를 처리할 jsp, asp, php, cgi 따위와 같은 프로그램의 URL 을 지정한다.

method : 데이터를 보낼 프로토콜을 설정한다. post 또는 get 두가지의 방식이 있다.

enctype : 파일 업로드에 관한 폼을 생성 할 때 주로 사용되는 속성이다.

          파일 업로드 폼 양식 작성시 multipart/form-data 로 설정해준다.

 일반적으로 form 태그는 입력양식의 값을 전송할때 사용되며 입력 양식이란 어떠한 데이터를 받아서

다음 페이지로 전송해주는 양식을 말한다.

 즉, 회원 가입, 설문 조사, 게시판 따위와 같이 어떠한 값을 저장하거나 출력하여 사용자에게

보여줘야 하는 경우에 사용된다.

 하나의 페이지 안에 여러개의 폼 태그가 존재 할 수 있지만 폼 태그 안에 또 다른 폼 태그가 올 수 없다.

입력 양식들

텍스트 입력 양식 : <input type="text" name="" value="" size="" maxlangth=""/>

비밀번호 입력 양식 : <input type="password" name="" value="" size="" maxlangth=""/>

보이지 않는 입력 양식 : <input type="hidden" name="" value=""/>

name : 입력 양식의 이름을 설정한다.

value : 입력 양식의 값을 설정한다.

size : 입력 양식의 가로 길이를 설정한다.

maxlength : 입력 양식 안에 입력될 수 있는 최대 글자 수를 설정한다.

readOnly : 입력 양식 안에 사용자가 직접 입력할 수 없도록 설정한다.

ex) <input type="text" name="totalPrice" value="10,000" readOnly/>

체크 박스 : <input type="checkbox" name="" value="" checked/>

name : 체크 박스의 이름을 설정한다.

value : 입력 양식의 값을 설정한다.

checked : 체크 박스를 체크 하게 설정한다.

 

라디오 버튼 : <input type="radio" name="" value="" checked/>

name : 라디오 버튼의 이름을 설정한다.

value : 입력 양식의 값을 설정한다.

checked : 체크 박스를 체크 하게 설정한다.

※ 라디오 버튼의 경우 두개이던 세개이던 다수의 라디오 버튼의 name 을 모두 똑같이 설정해주면

   name 이 동일한 다수의 라디오 버튼은 그 중 하나만 선택 되어질 수 있다.

 

셀렉트 박스

<select name="" size="" multiple>

      <option value="" selected>목록 1</option>

      <option value="">목록 2</option>

      <option value="">목록 3</option>

</select> 

name : 셀렉트 박스의 이름을 설정한다.

value : 입력 양식의 값을 설정한다.

checked : 체크 박스를 체크 하게 설정한다.

size : 펼쳐진 목록이 한번에 보여질 목록의 갯수를 설정한다.

multiple : 펼쳐진 목록에서 다수의 목록을 선택할 수 있도록 설정한다.

          선택은 Ctrl 또는 Shift 키를 누르고 선택하면 된다.

selected : 특정 목록을 선택하도록 설정한다.

텍스트 입력 영역 : <textarea name="" rows="" cols=""></textarea>

name : 텍스트 입력 영역의 이름을 설정한다.

rows : 텍스트 입력 영역의 세로 길이를 설정한다.

cols : 텍스트 입력 영역의 가로 길이를 설정한다.

버튼 : <input type="button" value=""/>

value : 버튼이 디스플레이 될때 버튼에 써지는 값을 설정한다.

전송 버튼 : <input type="submit" value=""/>

value : 전송 버튼이 디스플레이 될때 버튼에 써지는 값을 설정한다.

form 태그 안의 (<form> ~ </form>) 모든 입력 양식에의 값을 다음 페이지로 전송한다.

리셋 버튼 : <input type="reset" value=""/>

value : 리셋 버튼이 디스플레이 될때 버튼에 써지는 값을 설정한다.

form 태그 안의 (<form> ~ </form>) 모든 입력 양식에의 값을 리셋 시킨다.

 

파일 업로드 양식 : <input type="file" name=""/>

name : 파일 업로드 양식의 이름을 설정한다.

[출처] 폼 태그 (form)|작성자 lbiryu