[PHP] HTML FORM 태그에서 사용하는 select 태그

2022. 10. 11. 22:41Program/PHP

140_PHP HTML FORM 태그에서 사용하는 select 태그

[요약]

  • 클릭하면 아래로 쭉 펼쳐지는 셀렉트박스를 생성하는 select 태그에 대해 알아보자.

웹사이트에서 회원가입을 할 때 생년월일을 선택하면 아래로 쭉 목록이 펼쳐지는 박스를 본 적이 있을것이다.

이 기능은 select 태그를 사용하여 만든다.

select 태그 안에서 여러 개의 값을 표시하려면 option 태그를 사용하면 된다.


[select 태그 사용 방법]

<select name="birthMonth">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>

select 태그를 생성하고 보여질 목록은 select 태그 내에 option 태그를 만들어 표시한다.

option 태그 안에는 웹페이지에 표시될 값을 작성하고 value 속성에는 서버에 보낼 값을 작성한다.

 

다음은 select 태그를 사용하여 1월부터 12월까지 표시하는 예제이다.

[예제: 143_select.php ]

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>select 태그</title>
</head>
<body>
  <form name="폼태그이름" method="데이터전송방식" action="정보를보낼주소">
    <select name="birthMonth">
      <option value="1">1월</option>
      <option value="2">2월</option>
      <option value="3">3월</option>
      <option value="4">4월</option>
      <option value="5">5월</option>
      <option value="6">6월</option>
      <option value="7">7월</option>
      <option value="8">8월</option>
      <option value="9">9월</option>
      <option value="10">10월</option>
      <option value="11">11월</option>
      <option value="12">12월</option>
    </select>
  </form>
</body>
</html>

실행결과

위 그림에서 만약 4월을 선택하면 실제 서버에 전송되는 값은 [4월]이 아닌 value 속성의 값이 [4]가 전송된다.

 

 

 


 

 

 

초보자를 위한 PHP 200제
김태영 지음 | 정보문화사