본문 바로가기

비개발자의 개발 일지

현장 팀장에서 수출 ERP까지 — AI와 함께 시스템을 만든 기록

시리즈 보기
php

PHP select 드롭다운 — option 선택값 처리 완전 정리

by 왕진 2026. 7. 7.
반응형

 

 

Web Development · PHP Form

select 드롭다운 선택값 처리 — PHP 폼 완전 정리

value="" 빈 옵션으로 기본 안내문 구현, != "" 비교로 미선택 처리, option value와 표시 텍스트의 관계
시작 오늘 분석할 코드

<select>는 드롭다운 목록에서 하나를 선택하게 하는 HTML 요소다. 라디오버튼처럼 단일 값을 전송하지만, 항목 수가 많을 때 화면을 훨씬 깔끔하게 만들 수 있다. 빈 value 옵션으로 "미선택" 안내문을 구현하는 패턴이 핵심이다.

form.html — 드롭다운 폼 (행정구역 일부)
<FORM name="form1" method="post" action="view.php"> 행정구역: <SELECT name="prefecture"> <OPTION value="" selected>----- 행정구역을 선택하여 주세요. -----</OPTION> // 첫 화면 시 드롭창에서 이게 selected 고정되어 있음 <OPTION value="서울특별시">서울특별시</OPTION> <OPTION value="부산광역시">부산광역시</OPTION> <OPTION value="대구광역시">대구광역시</OPTION> // ... 이하 생략 (전체 17개 시도 + 북한 지명 포함) </SELECT> <INPUT type="submit" value="송신"> </FORM>
view.php — 수신 처리
<?php if($_POST["prefecture"] != ""){ print "행정구역:<BR>"; print $_POST["prefecture"]; }else{ print "행정구역을 선택하여 주세요.<BR>"; } ?>
실제 출력 미리보기
▼ 폼 화면 (기본 상태)
행정구역:

▼ 결과 화면 — "서울특별시" 선택 후 송신
행정구역:
서울특별시
용어 핵심 용어 정리
<select>드롭다운 목록 컨테이너. name 속성이 $_POST 키가 됨
<option>드롭다운 각 항목. value 속성 값이 서버로 전송됨
value=""빈 문자열 value를 가진 option. 안내문 역할 + 미선택 판단 기준
selected 속성페이지 로드 시 기본 선택 상태로 표시할 option에 추가
!= "" 비교select는 항상 값이 전송되므로 빈 문자열 여부로 미선택 판단
$_POST["prefecture"]선택된 option의 value 값. 기본 선택 유지 시 빈 문자열 ""
option 텍스트 vs value사용자에게 보이는 텍스트와 서버로 전송되는 value는 별개로 지정 가능
multiple 속성select에 추가하면 다중 선택 가능. 이 경우 checkbox처럼 name[]가 필요

1 select가 radio보다 나은 상황
항목이 많을 때 드롭다운이 적합한 이유

라디오버튼은 모든 옵션이 화면에 항상 펼쳐져 있어 항목이 3~4개를 넘으면 공간을 많이 차지한다. <select>는 사용자가 클릭할 때만 목록이 펼쳐지므로 항목이 많아도 공간을 적게 차지한다. 이 예시의 행정구역 22개처럼 목록이 길 때 select가 훨씬 낫다.

기술적으로 select도 단일 값을 전송하므로 PHP 처리는 라디오버튼과 동일하다. 다만 체크박스·라디오버튼과 달리 select는 항상 어떤 값이든 전송된다 — 기본 옵션이 선택된 채 제출돼도 그 option의 value가 온다.

radio (항목 22개)
22개 버튼이 모두 펼쳐짐
→ 화면 공간 낭비
→ 스크롤 필요
→ 시각적 부담
select (항목 22개)
한 줄 드롭다운으로 표시
→ 클릭 시 목록 펼침
→ 공간 효율적
→ 깔끔한 UX

2 value="" 빈 옵션의 역할
첫 번째 option이 안내문이면서 유효성 검사 기준이 되는 이유

첫 번째 option의 value=""는 두 가지 역할을 동시에 한다. 하나는 사용자에게 "선택하세요"라는 안내문 표시, 다른 하나는 선택 없이 제출됐을 때 PHP에서 != ""로 걸러낼 수 있는 유효성 검사 트리거다.

<OPTION value="" selected>----- 행정구역을 선택하여 주세요. -----</OPTION> ↑ value="" → PHP에서 빈 문자열로 수신 → !="" 조건이 false → "선택하세요" 출력 <OPTION value="서울특별시">서울특별시</OPTION> ↑ value="서울특별시" → PHP에서 "서울특별시" 수신 → !="" 조건이 true → 값 출력
※ select는 아무것도 선택 안 해도 반드시 어떤 값이 전송된다. 이 점이 체크박스·라디오버튼(미선택 시 키 없음)과 다른 핵심 차이다.

3 isset 대신 != "" 를 쓰는 이유
select는 항상 값이 전송되므로 isset이 의미 없다

체크박스나 라디오버튼은 아무것도 선택 안 하면 $_POST에 키가 없어서 isset()이 필요하다. 하지만 select는 반드시 하나가 선택된 상태로 폼이 제출된다. 기본 option이 선택됐어도 그 value가 전송된다. 따라서 키 존재 확인이 아니라 값이 빈 문자열인지 확인하는 것이 올바른 방법이다.

// select에서 아무것도 고르지 않고 제출 시: $_POST["prefecture"] = "" // 키는 항상 존재, 값만 빈 문자열 // 올바른 미선택 처리: if($_POST["prefecture"] != "") // 빈 문자열이 아닌지 확인 // 불필요하지만 안전한 형태 (isset 추가해도 문제는 없음): if(isset($_POST["prefecture"]) && $_POST["prefecture"] != "")
⚠ 첫 번째 option의 value를 지정하지 않으면, 해당 option의 텍스트 자체("----행정구역을 선택하여 주세요.----")가 value로 전송되어 != "" 조건이 항상 true가 된다.

 

반응형

 

4 option value와 표시 텍스트 분리
사용자에게 보이는 것과 서버로 전송되는 것이 다를 수 있다

option 태그 내부 텍스트는 사용자에게 보이는 라벨이고, value 속성은 서버로 전송되는 실제 데이터다. 이 둘을 분리하면 화면에는 친절한 설명을 보여주면서 서버에는 DB에 저장할 코드를 전송할 수 있다.

<!-- 화면 텍스트와 전송 value가 같은 경우 (이 예시) --> <OPTION value="서울특별시">서울특별시</OPTION> <!-- 화면 텍스트와 전송 value를 다르게 쓰는 경우 --> <OPTION value="11">서울특별시</OPTION> // DB 행정구역코드 "11" <OPTION value="26">부산광역시</OPTION> // DB 행정구역코드 "26"
실무에서 value ≠ 텍스트를 쓰는 대표적 패턴
  • DB에 저장할 숫자 ID (텍스트: "관리자", value: "1")
  • 짧은 코드 전송 (텍스트: "United States", value: "US")
  • 내부 키값 (텍스트: "배송 준비 중", value: "PENDING")

5 selected 속성 — 기본 선택 상태 지정
페이지 로드 시 어느 option이 미리 선택되게 할 것인가

selected 속성을 가진 option이 페이지 로드 시 기본으로 보인다. 이 예시에서는 "선택하세요" 안내 option에 붙어 있어 폼이 처음 뜰 때 항상 이 항목이 보인다. 만약 어떤 option에도 selected가 없으면 브라우저는 첫 번째 option을 기본으로 선택한다.

<!-- 기본 선택: 안내문 (미선택 상태 유도) --> <OPTION value="" selected>선택하세요</OPTION> <!-- PHP에서 이전 선택값을 다시 보여주는 패턴 --> <?php foreach($regions as $r): ?> <OPTION value="<?= $r ?>" <?php if($_POST["prefecture"] == $r) echo "selected"; ?> ><?= $r ?></OPTION> <?php endforeach; ?>

6 자주 하는 실수
실수 증상 해결
첫 option에 value 속성 없음 안내 텍스트 전체가 value로 전송 → != "" 조건 항상 true → 미선택 체크 불가 첫 option에 반드시 value="" 명시
select를 이용한 미선택 확인에 isset 사용 select는 항상 값이 전송되므로 isset은 항상 true → 미선택 구분 불가 != "" 빈 문자열 비교로 미선택 판단
multiple select에서 name에 [] 미추가 여러 개 선택해도 마지막 값 하나만 전달됨 multiple select 사용 시 name="region[]"로 배열 수신
출력 시 htmlspecialchars 미사용 사용자 입력(조작된 value)에 HTML 태그 포함 시 XSS 가능성 echo htmlspecialchars($_POST["prefecture"])로 이스케이프
</option> 닫는 태그 누락 구형 브라우저에서 렌더링 오류. 텍스트가 뭉쳐서 표시될 수 있음 각 option에 닫는 태그 </option> 명시 (HTML5에서는 생략 가능하나 명시 권장)

보충 PHP로 option 목록 동적 생성
행정구역처럼 고정 목록 대신 배열로 반복 생성하는 패턴

예제처럼 22개 option을 HTML에 직접 쓰면 코드가 길어진다. 실무에서는 배열을 foreach로 순회하며 option을 동적으로 생성한다. DB에서 목록을 가져올 때도 같은 패턴이 적용된다.

<?php $regions = ["서울특별시", "부산광역시", "대구광역시" /* ... */]; $selected = isset($_POST["prefecture"]) ? $_POST["prefecture"] : ""; ?> <SELECT name="prefecture"> <OPTION value="">-- 선택하세요 --</OPTION> <?php foreach($regions as $r): ?> <OPTION value="<?= htmlspecialchars($r) ?>" <?php if($r === $selected) echo "selected"; ?> ><?= htmlspecialchars($r) ?></OPTION> <?php endforeach; ?> </SELECT>
※ "되돌아가기" 기능이 있는 폼에서 사용자가 선택한 값을 유지하려면, 이처럼 이전 선택값과 현재 option을 비교해서 selected를 동적으로 추가한다.

핵심 한 줄 요약

select vs radio항목이 많으면 select, 3~4개 이하 직관적 선택은 radio
value="" 첫 option안내문 + 미선택 기준값 두 가지 역할을 동시에 담당
!= "" 비교select는 항상 값이 전송되므로 isset 대신 빈 문자열 비교로 미선택 판단
value ≠ 표시 텍스트화면 라벨과 서버 전송값을 분리해 DB 코드, 내부 키값 등을 깔끔하게 전달

Tags

#PHP #select #드롭다운 #option #selected속성 #$_POST #빈값체크 #폼처리 #행정구역 #웹개발
▼ 티스토리 태그 입력란 복사용
PHP, select, 드롭다운, option, selected속성, $_POST, 빈값체크, 폼처리, 행정구역, 웹개발
반응형

댓글