본문
1.입력 양식
- 서버로 전송할 입력 양식
- <form> … </form> 태그로 구성
- <form name="" action="" method=""…> 의 속성으로 구성.
name
폼의 이름
target
HTML에서 FRAME으로 나눈 창의 이름
action
정보를 넘겨받을 site의 이름
method
폼의 data를 전송하는 방식으로 get방식과 post방식이 있다.
enctype
서버로 전해질 data의 형식을 지정
onSubmit
data가 서버로 전송되기 전에 실행할 이벤트
onReset
reset 버튼을 눌렀을 때 실행할 이벤트
- <input type=""> <-- <form> 태그 안에서 사용
text
일반 텍스트 박스 컨트롤
password
비밀번호 텍스트 박스 컨트롤
hidden
숨겨진 필드 컨트롤
checkbox
체크박스 컨트롤
radio
라디오박스 컨트롤
file
파일 업로드 컨트롤
submit
전송 버튼 컨트롤
reset
입력값 초기화
button
버튼 컨트롤
image
이미지 컨트롤
- Text 컨트롤
name
객체 이름
value
처음에 보여질 값
size
text의 크기
maxlength
입력 가능한 글자의 크기
readonly
읽기전용 컨트롤로 변경
<input type="text" name="id" value="itkorea">
<input type="text" name="id" size="20" maxlength="10">
<input type="text" name="id" value="itkorea" readonly>
- Hidden 컨트롤
name
객체 이름
value
서버로 전달되는 값
<input type=“hidden" name=“key" value=““>
<input type=“hidden" name=“code" value=“">
- Password 컨트롤
name
객체 이름
value
처음에 보여질 값
size
password의 크기
maxlength
입력 가능한 글자의 크기
<input type=“password" name=“pwd" value="itkorea">
<input type=“password" name=“pwd" size="20" maxlength="10">
- CheckBox 컨트롤
name
객체 이름
value
처음에 보여질 값
checked
체크 박스 체크 설정
체크 박스가 체크되었으면 true, 해제되었으면 false를 리턴
<input type=“checkbox" name=“music" value=“음악">
<input type="checkbox" name=“swim" value=“수영">
<input type=“checkbox" name=“movie" value=“영화" checked>
- Radio 컨트롤
name
객체 이름
value
처음에 보여질 값
checked
라디오 박스 체크 설정
라디오 박스가 체크되었으면 true, 해제되었으면 false를 리턴
* name의 값이 같은 컨트롤 끼리 그룹으로 묶을 수 있다.
<input type=“checkbox" name=“birth" value=“양력“ checked>
<input type="checkbox" name=“birth" value=“음력">
- Button 컨트롤
name
객체 이름
value
Button 위에 보여질 문자를 지정한다.
<input type=“button" name=“btnLogin" value=“로그인“>
<input type=“button" name=“btnSerarch" value=“검색">
- Submit 컨트롤
name
객체 이름
value
Submit Button 위에 보여질 문자를 지정한다.
<input type=“submit" name=“btnSend" value=“전송">
- Reset 컨트롤
name
객체 이름
value
Reset Button 위에 보여질 문자를 지정한다.
<input type=“reset" name=“btnInit" value=“초기화“>
- FileUpload 컨트롤
name
객체 이름
value
FileUpload 객체의 입력 양식에 기재된 내용
<input type=“file" name=“fileControl">
- Radio 컨트롤
name
객체 이름
value
처음에 보여질 값
multiple
다중 선택의 여부를 결정짓는 속성으로, 생략하면 목록 중에서 하나만
선택이 가능하다.
option
목록상자의 각 목록
- selected: 현재의 목록을 선택한 상태로 만들어 준다.
- value: 선택 시 서버에 전달 될 값.
- text: 선택 된 목록의 문자열
- index: 선택 된 목록의 인덱스
- ex) options[i].value, options[i].selected
<select name=“job” multiple>
<option>학생
<option>직장인
</select>
- TextArea 컨트롤
name
객체 이름
rows
textarea의 세로 길이
cols
textarea의 가로 길이
wrap
글자가 우측 끝까지 입력되었을 경우 자동으로 줄을 바뀌게 할 지의
여부를 결정한다.
- off: 자동 줄 바꿈 하지 않음.
- virtual / soft: client에서는 자동 줄 바꿈이 되나, 서버에는 줄이 안 바뀐 것으로 전달 됨.
- physical / hard: client에서도 줄 바꿈이 되고, 서버에도 줄이 바뀐 상태로 전달 됨.
<textarea cols=“50” rows=“3” wrap=“off”>
</textarea>
관련링크
댓글목록
등록된 댓글이 없습니다.