폼 만들기

form 태그

사용자가 입력한 데이터를 서버로 전송하기 위해 사용한다.
기본형:
<form action="search.php" method="psot">
<!-- All our inputs will go in here -->
</form>
form 태그에서 사용하는 속성들:
method:
	get:주소표시줄에 사용자가 입력한 내용이 그래도 드러난다.
        post:사용자가 입력한 내용이 드러나지 않는다.
action: 태그 안 내용들을 처리해줄 서버 상의 프로그램지정한다.

input 태그

사용자가 입력하는 대부분은 <input>태그를 이용해 처리한다.
중요한 type
hidden: 화면상의 폼에는 보이지않는다.
password: 비밀번호 입력란이다.
text:    한 줄짜리 텍스트 입력 필드이다.
search:  검색 필드이다.
email:   메일 주소 입력 필드이다.
url  :   웹 주소 필드이다.
tel  :   전화번호 입력 필드이다.
radio:   여러 항목 중 하나만 선택할 때 사용한다.
checkbox:여러 항목 중 둘 이상 선택할 때 사용한다.
submit:  사용자 입력 내용을 서버로 전송한다.
reset :  사용자 입력 내용 전부 삭제한다.

radio 예시

<form>
<p>콜라가 좋아 사이다가 좋아?</p>
  <label><input type="radio" name="drink" value="cola">콜라</label>
  <label><input type="radio" name="drink" value="cider">사이다</label>
</form>

콜라가 좋아 사이다가 좋아?

콜라 사이다

checkbox 예시

<form>
  <p>어떤 노래 좋아해?</p>
  <label><input type="checkbox" name="장르" value="발라드">발라드</label>
  <label><input type="checkbox" name="장르2" value="댄스가요">댄스가요</label>
  <label><input type="checkbox" name="장르3" value="힙합">힙합</label>
</form>

어떤 노래 좋아해?

발라드 댄스가요 힙합

submit, reset 예시

<form >
  <label>메일주소 <input type="text"></label>
  <input type="submit" value"제출">
  <input type="reset" value="다시입력">
</form>

메일주소

label, fieldset, legend 태그

label
폼 요소에 레이블을 붙이는 태그이다.
라디오 버튼이나 체크 박스에서 텍스트 부분을 클릭해도 라디오 버튼과 체크 박스 버튼이 선택된다.
fieldset
폼 요소를 그룹으로 묶는 태그이다.
legend
그룹으로 묶는 구역에 제목을 붙이는 태그이다.
ex)
<from>
  <filedset>
    <legend>로그인 정보</legend>
      <ul>
        <li>
          <label for="id">아이디</label>
  	  <input type="text" id="id">
        </li>
        <li>
         <label for="pwd">비밀번호</label>
         <input type="text" id="pwd">
        </li>
       </ul>
      </fieldset>
     <form>

로그인 정보

• 아이디
• 비밀번호

```