jiraynor’s 하루 2시간 프로그래밍 - HTML 36. 폼 속성 (Form Attributes) 영상 보러가기

HTML 폼 속성

action 속성

action 속성은 양식을 제출할 때 수행할 작업을 정의합니다.

보통 폼 데이터는 사용자가 Submit 버튼을 클릭하면 서버상의 파일로 송신됩니다.

다음 예제에서는 폼 데이터가 “action_page.php”라는 파일로 전송됩니다. 이 파일에는 폼 데이터를 처리하는 서버측 스크립트가 포함되어 있습니다.

예제 1
<form action="/action_page.php">
  <label for="fname">First name:</label><br>
  <input type="text" id="fname" name="fname" value="John"><br>
  <label for="lname">Last name:</label><br>
  <input type="text" id="lname" name="lname" value="Doe"><br><br>
  <input type="submit" value="Submit">
</form>

action 속성을 생략하면 액션은 현재 페이지로 설정됩니다.

target 속성

target 속성은 양식을 제출한 후 수신된 응답을 표시할 위치를 지정합니다.

target 속성에는, 다음의 몇개의 값을 지정할 수 있습니다.

설명
_blank 응답이 새 창 또는 탭에 표시됩니다.
_self 응답이 현재 창에 표시됩니다.
_parent 응답이 부모 프레임에 표시됩니다.
_top 응답이 창의 전체 본문에 표시됩니다.
framename 응답이 이름 있는 iframe에 표시됩니다.

기본값은 _self 입니다. 이것은 응답이 현재 창에서 열리는 것을 의미합니다.

예제 2
<form action="/action_page.php" target="_blank">

method 속성

method 속성은 폼 데이터를 제출할 때 사용하는 HTTP 메서드를 지정합니다.

폼 데이터는 URL 변수 (method="get") 또는 HTTP 포스트 트랜잭션(method="post")으로 전송할 수 있습니다.

폼 데이터를 송신할 때의 디폴트의 HTTP 방식은, GET 입니다.

예제 3 - GET 방식 전송
<form action="/action_page.php" method="get">
예제 3 - POST 방식 전송
<form action="/action_page.php" method="post">

GET 관련 주의사항:

  • 이름/값 쌍의 URL에 양식 데이터를 추가합니다.
  • GET을 사용하여 기밀 데이터를 전송하지 마십시오! (제출된 폼 데이터는 URL에 표시됩니다!)
  • URL의 길이는 제한되어 있습니다(2048 문자).
  • 사용자가 결과를 북마크하려는 양식 제출에 유용합니다.
  • GET은 Google의 쿼리 문자열과 같이 안전하지 않은 데이터에 적합합니다.

POST 관련 주의사항:

  • HTTP 요청 본문 내에 폼 데이터를 추가합니다(제출된 폼 데이터는 URL에 표시되지 않음).
  • POST에는 사이즈 제한이 없기 때문에, 대량의 데이터를 송신할 수 있습니다.
  • POST가 포함된 양식 제출은 북마크할 수 없습니다.

폼 데이터에 기밀 정보나 개인정보가 포함되어 있는 경우는, 항상 POST 를 사용해 주세요.

autocomplete 속성

autocomplete 속성은 폼의 자동 완성 여부를 지정합니다.

자동 완성이 켜져 있으면 브라우저는 사용자가 이전에 입력한 값에 따라 자동으로 값을 완성합니다.

예제 4
<form action="/action_page.php" autocomplete="on">

novalidate 속성

novalidate 속성은 논리 속성입니다

존재하는 경우는 송신시에 폼 데이터(입력)를 검증하지 않는 것을 지정합니다.

예제 5
<form action="/action_page.php" novalidate>