수정할 수 없는 입력란도 폼 데이터에 들어갈까?
같은 값이 보이는 텍스트 입력란을 비활성화·읽기 전용으로 바꾸고, 브라우저가 만든 폼 데이터에 값이 포함되는지 확인합니다.
그림에서 무엇을 볼까요?
name이 code이고 값이 K17인 텍스트 입력란은 readonly이면 폼 데이터에 포함되지만 disabled이면 제외되는 비교도
대출 신청 화면에 항목 코드 K17이 보인다고 합시다. 사용자가 그 코드를 고칠 수 없도록 만든 입력란도 구현 방법은 여러 가지입니다. disabled(디세이블드, 비활성화)는 입력란을 비활성 상태로 만들고, readonly(리드온리, 읽기 전용)는 텍스트를 사용자가 수정하지 못하게 합니다.
두 입력란은 비슷하게 보여도 폼 데이터 구성 결과가 다릅니다. 브라우저의 표준 절차는 비활성화된 필드를 건너뜁니다. 반면 읽기 전용이라는 이유만으로 필드를 제외하지 않습니다. 화면에 값이 있는지와 제출 항목에 그 값이 있는지를 각각 확인해야 합니다.
함께 확인할 점
HTML(에이치티엠엘, 웹 문서의 구조를 적는 언어)의 텍스트 입력란 하나를 사용합니다. FormData(폼 데이터, 폼의 이름·값 항목 묶음)를 브라우저 안에서 만들 뿐 서버로 전송하거나 저장하지 않습니다. 실제 개인정보를 입력하지 마세요.
생각해 볼 질문
일반 입력·읽기 전용·비활성화 각각에서 name이 있을 때와 없을 때의 결과를 기록하세요. 화면 표시만으로 확인할 수 없는 다음 단계도 적어 보세요.
평균이 같으면 모습도 같을까?
더 많이 수료한 반이 성공률도 높을까?
반납함 두 곳은 어디에 놓아야 할까?