<fome><input><select><GET><POST>

<form></form>

1. name

-폼이름, 여러개의 폼이 있을 때 구분 위해

 

2.action

-데이터를 전달받는 주소는 반드시 PHP와 같은 서버스크립트파일이어야 한다.

-action 값 지정하지 않으면 자신의 페이지로 정보를 전달

 

3.method 

-GET : URL통해서 전달

-POST : HTTP바디에 데이터 실어서 전달

 

4.ENCTYPE

-폼데이터 인코딩

-GET이면 ENCTYPE지정해도 원하는 결과얻지 못함

-POST전송일 경우만 적용

-application/x-www-form-urlencodede는 ENCTYPE지정않았을 때 기본값으로 폼 정보를 URL 인코딩 통해 전송

-multipart/form-date는 여러가지 MIME형식의 데이터를 전송하려는 방법

->임의의 문자열을 이용하여 각 항목을 구분짓고 이를 통해 전송되는 값을 읽어들인다

->대표적인 경우 : 파일업로드

=폼의 텍스트 정보와 GIF, JPG와 같은 이밎 또는 exe와 같은 실행파일 등 여러가지 MIME타입을 갖는 데이터를 전송하기 때문

 

5.TARGET 

-폼 정보 모두 전송하고 그 결과를 보여 줄 프레임이나 창의 이름을 지정

-<a>태그에서 사용하는 target과 같은 것으로 생각

---

●이벤트 핸들러

-특정 이벤트가 발생했을 떄 이를 감지하고 해당 이벤트를 처리할 수 있는 함수를 호출하거나 명령 처리

-명령어는 모두 자바스크립트로 처리

1. OnSubmit

-submit버튼 클릭하거나 자바스크립트를 이용하여 submit을 실행한 경우 발생

-사용자가 폼에 작성한 정보가 올바른지 검사

 

2.OnReset

-reset버튼 클릭하거나 자바스크립트 이용하여 reset 을 실행한 경우

-사용자의 입력에 의해서 설정된 값들을 초기화하기 위해서 사용

 

●여러 테이블에서의 폼태그

-테이블과 테이블 사이 공백발생

1. 폼 태크를 테이블 태그안에 집어넣는 방법

->반드시 특정 위치에만 넣어야 함

 

2.스타일 시트 이용

->style = "display :inline "

->폼태크 위치 상관 없음

---

<input></input>

-각종 텍스트값의 입력과 버튼 그리고 체크상자와 라디오 상자 만듬

●일반 텍스트 입력 상자

<input type = "text">

-짧은 텍스트 입력

-입력한 값 전송하려면 이름 설정 필요

name = "name"

->php페이지에서 이 값을 

$_GET['name'] 또는 $_POST['name']으로 전달받음

->GET, POST는 폼태그의 method에 따라

 

1. name

2. value : 입력상자의 초기값 지정 기능

3. size : 입력상자의 가로길이 조절

4. maxlength : 입력 최대 글자 수, 영문자 하나와 한글 하나는 같이 한 자로 취급, 사용자의 입력을 봉쇄할 뿐 데이터 전송길이 제한 없음

 5. readonly : 읽기만 가능

 

●비밀번호 입력상자

<input type = "password">

-입력한 값이 (*)로 출력

-알파벳, 숫자, 기호 입력

-입력값 캐시에 저장되지 않기 때문에 뒤로가기 누르면 입력값 출력

-초기값 한글로 설정하면 *로 출력되고 그 값은 한글값 그대로 전송

-GET방식으로 전송하면 주소창에 비밀번호 정보가 그대로 노출

-반드시 POST방식

-GET 이용시 urldecode함수로 쉽게 값 확인 가능

 

●파일 선택 상자

<input type = "file">

-파일 업로드, 파일의 위치 정보 기록ㅎ라고자 할 때 사용

-웹브라우저의 파일탐색 브라우저 띄워짐

->선택한 파일은 텍스트 입력 상자에 파일주소 자동 입력

-POST 방시과 multipart/form-date인코딩 형식을 지정해야 동작

 

●체크상자

<input type = "checkbox">

-각 항목에 대한 선택여부 확인

-선택을 하면 지정된 값이 전송되는 방식

$_GET['name'] 또는 $_POST['name']으로 value에 지정된 값 전달받을 수 있다

-체크상자 선택 안하면 변수 자체가 전달되지 않는다

-checked : 기본적으로 선택되게 하고 싶을 떄

 

●라디오 상자

<input type = "radio">

-여러개의 항목 중의 하나만 선택(반드시)

-항목들은 반드시 NAME 값이 같아야 한다

-항목들 중 반드시 하나의 값을 기본값으로 지정해야 한다.

 

●일반버튼

<input type = "button">

-단순히 버튼 모양만 만들고 다른 기능이 없는 기본적 태그

-value로 지정된 문구가 버튼에 출력

-자바스크립트로 기능 부여

 

●쿼리전송버튼

<input type = "submit">

-폰의 입력한 정보를 폼의  action에 지정된 주소로 전송

-폼 정보 전송하려면 반드시 submit이 필요

->자바스크립트 또는 쿼리 전송버튼 사용

-OnSublit이벤트 핸들러 사용해 폼의 정보가 전송되기 이전에 사용자가 원하는 동작을 하게 만듬

-버튼의 일종으로 OncClick이벤트 핸들러 사용가능

->OnClick에 지정된 스크립트가 수행된 후에는 무조건 폼의 전송이 이루어진다

 

●리셋버튼

<input type = "reset">

-입력한 정보 모두 원래의 초기값으로 되돌림

-value있으면 해당 초기값으로 들어감

 

●이미지버튼

<input type = "image">

-사용자가 정의한 모양의 그림이미지 버튼

-submit이벤트 발생

->일반이벤트와 같이 사용하고자 할 떄는 OnClick사용하고 submit발생하지 않게 해주기

OnClick = "alert('CLICK'); return false;"

 

●숨겨진 상자

<input type = "hidden">

-사용자가 수정해서는 안되는 값이나 눈에 보이지 않게 여러가지 값 전송

-크게 신뢰해서는 안된다

---

<select></select>

-3개 이상의 목록에서 하나 혹은 그 이상의 항목을 선택하고자 할 때 사용하는 폼 컨트롤

●콤보상자

-목록 중에서 하나만 선택

-size는 지정안하거나 1로 함

 

●리스트 상자

-하나 혹은 그 이상의 복수로 선택

->다중선택시 multiple 추가하고 이름을 배열 형식으로 바꿔야함

name = select[]

$_GET['select'][0],
$_POST['select'][1]로 전달

 

●위 두 상자와 상관없이 여러항목 중에서 기본적인 선택값 지정하고자 한다면 <option>태그에 selected 추가

---

<TEXTAREA></TEXTAREA>

-여러 문잔에 걸친 긴 글 입력위함

-크기는 ROWS와 COLS(가로)로 사용

---

<GET>

-URL로 정보 전달 = 전달값이 겉으로 드러남

-파일 이름 다음에 ? 기호 사용해 "?변수명 = 전달될 값"

-두개 이상값 전달시 & 사용

-길이 제한 : 대략 2KB미만

 

<POST>

-REQUEST BODY통해 전달

-겉으로 드러나지 않고 데이터길이에 대한 제약이 없어서 매우 큰 용량의 정보를 전송할 때

-폼과 함께 파일 전송하는 등 여러가지 형태의 데이터 전송할떄

-php에서 POST로 전송할 수 있는 크기 제한

->php.ini파일에서 max_post_size값 늘려서 변ㄱ경