html기본
<form>태그 이용하기
-html을 이용하여 웹페이지를 만들다보면, 데이터를 입력받아 서버로 전달할 일이 자주 생긴다.
데이터의 입력은 input, textarea등 다양한 데이터의 타입에따라 다양하게 사용가능하다.
데이터를 입력하는 이유는 입력받은 데이터를 이용하여 '무언가'를 하려고 하기때문에
주로 form태그 안에 쓰인다. 이때 action과 method등의 속성을 써서 데이터를 적절히 이용할 수 있다.
<form> //<form action="..." method="...">처럼 사용함
여러가지 입력방법
...
</form>
form태그에서 사용하는 입력방법
input태그(input태그는 form태그 밖에서도 다양하게 쓰이지만, 일단은 form태그에서 주로쓰이는것들만.)
type - //<form>태그의 중요한 요소중 하나 <input type="..." /> 이런식으로 쓴다.
└ text :: 로그인 할때 쓰는 한줄짜리 텍스트박스를 만든다.
└ password :: text와 마찬가지로 한줄짜리 텍스트박스지만, 입력받는 정보를 '●' 로 표시해준다.(비밀번호)
└ radio :: 체크할 수 있는 버튼을 만드는데, 하나만 체크할 수 있다.
└ checkbox :: 여러개 체크할 수 있는 체크박스를 만든다.
└ button :: 버튼을 만든다. //요건 어따쓰는건지;;
└ submit :: form태그의 action속성을 통해 지정된 페이지로 데이터를 제출한다.
...
//input태그에서 readonly 를 추가하면 수정할 수 없다.
//ex) <input type="text" name="name" value="name" readonly> 회원수정등에서 아이디같은건 수정
불가하도록 할 때
textarea태그 - 데이터가 긴 문장일때 사용됨
<textarea rows="표시할 행" cols="표시할 열"></textarea>
select태그 - drop down 리스트를 만들때 사용됨
select태그의 영역안에 option태그를 사용해서 리스트의 값을 정해준다.
<select name="직업">
<option value="회사워">회사원</option>
<option value="학생">학생</option>
<option value="...">...</option>
.......
</select>
부가기능(?) : 옵션에서 selected속성을 사용해 default값을 정해줄 수 있다.
//<option value="..." selected="selected">...</option>
-추가로, <label>태그를 이용하면 입력영역의 설명(?)을 달 수 있다.
<label for="id">ID를 입력하세요</label>
<input type="text" id="id" name="id" />
일단 form태그의 기본적인 사용방법들만 적었는데, action과 method속성들을 사용하여 데이터를 전달하고,
php스크립트 등을 사용해서 데이터를 전달받고, 이용할 수 있다.
php스크립트에서 전달받은 데이터를 이용할 때::
form태그에서 method로 전달방식을 지정한 후, action에서 지정한 페이지에서 그 변수들을(데이터들을)
원하는대로 쓸 수 있다.
전달방식은 POST 또는 GET방식 등이 있고, method="POST" 와 같이 사용한다.
그리고 지정한 페이지에서 $_전달방식['지정한 이름'] 와 같이 사용한다.
//태그의 이름은 name속성을 써서 지정할 수 있고, name대신 id 를 사용하기도 한다.
ex)<!-- .html -->
<form action="xxx.php" method="POST">
<label for="id">ID ::</label>
<input type="text" name="id"/>
<label for="pw">PASSWORD::</label>
<input type="password" name="pw"/>
</form>
ex2)<!-- .php -->
<?php
$user_id = $_POST['id']; //그냥 계속해서 $_POST['id'] 요렇게 써도 상관없음
$user_pw = $_POST['pw'];
...
?>
'Coding Note' 카테고리의 다른 글
[PHP] 기본적인 코딩규칙 (0) | 2011.01.31 |
---|---|
[C++ ]friend (0) | 2011.01.27 |
[winAPI] 얌얌.exe - 재밌다ㅋ (0) | 2011.01.27 |
[HTML] HTML 기본 (0) | 2010.11.17 |
[Network] OSI 7 Layers (Open System Interconnection) (0) | 2010.11.10 |