1. form 태그
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8"/>
<title>제목</title>
</head>
<body>
<form>
<!--사용자가 입력하는 입력 양식-->
<input type="text" name="text"value ="입력텍스트"/><br>
<input type+"password" name="password" value="패스워드"/><br>
<input type="file" name="file" value="file"/><br>
<input type="checkbox" name="checkbox" value="yes"/><br>
<input type="radio" name="radio" value="남자"/><br>
<!--보이지 않는 입력 양식-->
<input type="hidden" name="hidden" value="안보임"/><br>
<!-- 버튼 -->
<input type="button" value="버튼"/><br>
<input type="reset" value="지움"/><br>
<input type="submit" value="확인"/><br>
<input type="image" src="http://placehold.it/100x100"/>
</form>
</body>
</html>
2.이름 입력 값 처리
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8"/>
<title>제목</title>
</head>
<body>
<form name = "register" method="post" action="javascript:check();">
<fieldset>
<legend>입력양식</legend>
<table>
<tr>
<td><label for="name">이름</label></td>
<td><input id="name" type="text" name="user_name"></td>
</tr>
</table>
<input type="button" value="확인" onclick="check();" >
</fieldset>
</form>
</body>
</html>
3.자바스크립트 추가
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8"/>
<title>제목</title>
</head>
<body>
<form name = "register" method="post" action="javascript:check();">
<fieldset>
<legend>입력양식</legend>
<table>
<tr>
<td><label for="name">이름</label></td>
<td><input id="name" type="text" name="user_name"></td>
</tr>
</table>
<input type="button" value="확인" onclick="check();" >
</fieldset>
</form>
<script type="text/javascript">
window.onload = function(){
document.register.user_name.focus();
}
function check(){
ff = document.register;
if(ff.user_name.value == "") {
alert("이름을 입력하세요");
ff.user_name.focus();
return;
}
ff.action = "ex01_proc.php";
ff.submit();
}
</script>
</body>
</html>
4. php
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8"/>
<title>제목</title>
</head>
<body>
<? echo "입력한 이름 = ".$_POST["user_name"]." 입니다.<br>";
#문자와 문자를 연결할때에는 . . 으로 연결한다.
?>
</body>
</html>
5. 이름 입력. 성별 입력
#ex01.php
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8"/>
<title>제목</title>
</head>
<body>
<form name = "register" method="post" action="javascript:check();">
<fieldset>
<legend>입력양식</legend>
<table>
<tr>
<td><label for="name">이름</label></td>
<td><input id="name" type="text" name="user_name"></td>
</tr>
<tr>
<td><label for="name">성별</label></td>
<td>
<input id="man" name="sex" type="radio" value="M"><label for="man">남자</label>
<input id="woman" name="sex" type="radio" value="W"><label for="woman">여자</label>
</td>
</tr>
</table>
<input type="button" value="확인" onclick="check();" >
</fieldset>
</form>
<script type="text/javascript">
function check(){
ff = document.register;
if(ff.user_name.value == "") {
alert("이름을 입력하세요");
ff.user_name.focus();
return;
}
if(ff.sex[0].checked == false && ff.sex[1].checked == false) {
alert("성별을 체크하세요");
return;
}
ff.action = "ex01_proc.php";
ff.submit();
}
</script>
</body>
</html>
#ex01_proc.php
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8"/>
<title>제목</title>
</head>
<body>
<?
echo "입력한 이름은 ".$_POST["user_name"]." 입니다.<br>";
$sex = $_POST["sex"];
if( $sex == "M") {
echo "체크한 성별은 남자 입니다.<br>";
} else {
echo "체크한 성별은 여자 입니다.<br>";
}
#문자와 문자를 연결할때에는 . . 으로 연결한다.
?>
</body>
</html>
6.패스워드
#ex01.php
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8"/>
<title>제목</title>
</head>
<body>
<form name = "register" method="post" action="javascript:check();">
<fieldset>
<legend>입력양식</legend>
<table>
<tr>
<td><label for="name">비밀번호</label></td>
<td><input id="name" type="password" name="user_pwd"></td>
</tr>
<tr>
<td><label for="name">비밀번호 확인</label></td>
<td><input id="name" type="password" name="user_repwd"></td>
</tr>
</table>
<input type="button" value="확인" onclick="check();" >
</fieldset>
</form>
<script type="text/javascript">
window.onload = function(){
document.register.user_pwd.focus();
}
function check(){
ff = document.register;
if(ff.user_pwd.value == "") {
alert("패스워드를 입력하세요");
ff.user_pwd.focus();
return;
}
if(ff.user_repwd.value == "") {
alert("입력한 패스워드를 재입력 입력하세요");
ff.user_repwd.focus();
return;
}
if(ff.user_pwd.value != ff.user_repwd.value){
alert("패스워드가 일치 하지 않습니다.");
ff.user_repwd.value = "";
ff.user_repwd.focus();
return;
}
ff.action = "ex01_proc.php";
ff.submit();
}
</script>
</body>
</html>
#ex01_proc.php
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8"/>
<title>제목</title>
</head>
<body>
<?
echo "입력한 패스워드는 ".$_POST["user_pwd"]." 입니다.<br>";
echo "입력한 패스워드는 ".$_POST["user_repwd"]." 입니다.<br>";
#문자와 문자를 연결할때에는 . . 으로 연결한다.
?>
</body>
</html>
7.통합
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8"/>
<title>제목</title>
</head>
<body>
<form name = "register" method="post" action="javascript:check();">
<fieldset>
<legend>입력양식</legend>
<table>
<tr>
<td><label for="name">이름</label></td>
<td><input id="name" type="text" name="user_name"></td>
</tr>
<tr>
<td><label for="name">성별</label></td>
<td>
<input id="man" name="sex" type="radio" value="M"><label for="man">남자</label>
<input id="woman" name="sex" type="radio" value="W"><label for="woman">여자</label>
</td>
</tr>
<tr>
<td><label for="name">비밀번호</label></td>
<td><input id="name" type="password" name="user_pwd"></td>
</tr>
<tr>
<td><label for="name">비밀번호 확인</label></td>
<td><input id="name" type="password" name="user_repwd"></td>
</tr>
</table>
<input type="button" value="확인" onclick="check();" >
</fieldset>
</form>
<script type="text/javascript">
window.onload = function(){
document.register.user_pwd.focus();
}
function check(){
ff = document.register;
if(ff.user_name.value == "") {
alert("이름을 입력하세요");
ff.user_name.focus();
return;
}
if(ff.sex[0].checked == false && ff.sex[1].checked == false) {
alert("성별을 체크하세요");
return;
}
if(ff.user_pwd.value == "") {
alert("패스워드를 입력하세요");
ff.user_pwd.focus();
return;
}
if(ff.user_repwd.value == "") {
alert("입력한 패스워드를 재입력 입력하세요");
ff.user_repwd.focus();
return;
}
if(ff.user_pwd.value != ff.user_repwd.value){
alert("패스워드가 일치 하지 않습니다.");
ff.user_repwd.value = "";
ff.user_repwd.focus();
return;
}
ff.action = "ex01_proc.php";
ff.submit();
}
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8"/>
<title>제목</title>
</head>
<body>
<?
echo "입력한 이름은 ".$_POST["user_name"]." 입니다.<br>";
$sex = $_POST["sex"];
if( $sex == "M") {
echo "체크한 성별은 남자 입니다.<br>";
} else {
echo "체크한 성별은 여자 입니다.<br>";
}
echo "입력한 패스워드는 ".$_POST["user_pwd"]." 입니다.<br>";
echo "입력한 패스워드는 ".$_POST["user_repwd"]." 입니다.<br>";
print_r($HTTP_POST_VARS);
#문자와 문자를 연결할때에는 . . 으로 연결한다.
?>
</body>
</html>
8.이용약관
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8"/>
<title>제목</title>
</head>
<body>
<form name = "register" method="post" action="javascript:check();">
<fieldset>
<legend>입력양식</legend>
<table>
<tr>
<td><label for="name">이름</label></td>
<td><input id="name" type="text" name="user_name"></td>
</tr>
<tr>
<td><label for="name">성별</label></td>
<td>
<input id="man" name="sex" type="radio" value="M"><label for="man">남자</label>
<input id="woman" name="sex" type="radio" value="W"><label for="woman">여자</label>
</td>
</tr>
<tr>
<td><label for="name">비밀번호</label></td>
<td><input id="name" type="password" name="user_pwd"></td>
</tr>
<tr>
<td><label for="name">비밀번호 확인</label></td>
<td><input id="name" type="password" name="user_repwd"></td>
</tr>
</table>
</fieldset>
<fieldset>
<legend>약관</legend>
<table>
<tr>
<td><textarea name ="agree_text" rows="5" cols="70" readonly>사용자 이용약관 동의 내용 입니다. 학번 5112648 이름 : 김정빈
기타문의 :321-321</textarea></td>
</tr>
<tr>
<td> <input type = "checkbox" id = "chk" name="agree_check" value ="F"><label for ="chk">동의함</label></td>
</tr>
</table>
</fieldset>
<input type="button" value="회원가입" onclick="check();" >
</form>
<script type="text/javascript">
function check(){
ff = document.register;
if(ff.user_name.value == "") {
alert("이름을 입력하세요");
ff.user_name.focus();
return;
}
if(ff.sex[0].checked == false && ff.sex[1].checked == false) {
alert("성별을 체크하세요");
return;
}
if(ff.user_pwd.value == "") {
alert("패스워드를 입력하세요");
ff.user_pwd.focus();
return;
}
if(ff.user_repwd.value == "") {
alert("입력한 패스워드를 재입력 입력하세요");
ff.user_repwd.focus();
return;
}
if(ff.user_pwd.value != ff.user_repwd.value){
alert("패스워드가 일치 하지 않습니다.");
ff.user_repwd.value = "";
ff.user_repwd.focus();
return;
}
if(ff.agree_check.checked == false) {
alert("이용약관에 동의 하세요.");
ff.agree_check.focus();
return;
} else {
ff.agree_check.value = "T";
}
ff.action="ex04_proc.php";
ff.submit();
}
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8"/>
<title>제목</title>
</head>
<body>
<?
echo "입력한 이름은 ".$_POST["user_name"]." 입니다.<br>";
$sex = $_POST["sex"];
if( $sex == "M") {
echo "체크한 성별은 남자 입니다.<br>";
} else {
echo "체크한 성별은 여자 입니다.<br>";
}
echo "입력한 패스워드는 ".$_POST["user_pwd"]." 입니다.<br>";
echo "입력한 패스워드는 ".$_POST["user_repwd"]." 입니다.<br>";
print_r($HTTP_POST_VARS);
?>
</body>
</html>
'이전것 > 개발' 카테고리의 다른 글
php -> two-dimensional arrays (0) | 2016.07.06 |
---|---|
php -> make table, array, triangle (0) | 2016.07.05 |
HTML5 (2) (0) | 2016.07.05 |
HTML5 (0) | 2016.07.04 |
module (2) (0) | 2016.05.09 |