R's Hacking Daily Log

php - Mini Project 1 - (4) 본문

PHP

php - Mini Project 1 - (4)

hanhxx 2023. 8. 1. 01:22

[ Mini Project - last ]

index.php에서 Login 버튼을 눌렀을 때 실행될 파일 login_check.php에 대해 살펴보았다.

이번 글에서는 REGISTER 버튼을 눌렀을 때 출력될 페이지 register.php를 만들어보자!

 

[ register.php ]

<?php
include("./dbconn.php");

if(isset($_SESSION['ss_mb_id'])) {
    $mb_id = $_SESSION['ss_mb_id'];
    $sql = "SELECT * FROM member WHERE mb_id = '$mb_id'";
    $result = mysqli_query($conn, $sql);
    $mb = mysqli_fetch_assoc($result);
    mysqli_close($conn);

    $mode = "modify";
    $title = "EDIT info";
    $modify_mb_info = "readonly";
    $href = "./member_list.php";
} else {
    $mode = "insert";
    $title = "REGISTER";
    $modify_mb_info = "";
    $href = "./index.php";
}
?>

<html>  
    <head>
        <title>Register</title>
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css">
        <link rel="stylesheet" href="./css/style.css">
    </head>
    <body>
        <div class="container">
            <h4 class="display-4 text-center"><?php echo $title ?></h4>

            <form action="./register_update.php" method="post">
                <input type="hidden" name="mode" value="<?php echo $mode ?>">

                <label for="mb_id">ID</label>
                <div class="mb-3">
                    <input type="text" id="mb_id" name="mb_id" class="form-control" value="<?php echo $mb['mb_id'] ?? '' ?>" <?php echo $modify_mb_info ?>>
                </div>

                <label for="mb_password">PASSWORD</label>
                <div class="mb-3">
                    <input type="password" id="mb_paswword" name="mb_password" class="form-control">
                </div>

                <label for="mb_password_re">Check Password</label>
                <div class="mb-3">
                    <input type="password" id="mb_password_re" class="form-control" name="mb_password_re">
                </div>

                <label for="mb_name">NAME</label>
                <div class="mb-3">
                    <input type="text" class="form-control" id="mb_name" name="mb_name" value="<?php echo $mb['mb_name'] ?? '' ?>">
                </div>

                <label for="mb_email">EMAIL</label>
                <div class="mb-3">
                    <input type="email" id="mb_email" name="mb_email" class="form-control" value="<?php echo $mb['mb_email'] ?? '' ?>">
                </div>

                <label>JOB</label>
                <div class="mb-3">
                    <select name="mb_job" class="form-select">
                        <option value="Student" <?php echo ($mb['mb_job']) == 'Student ? "selected" : ""; '?>>Student</option>
                        <option value="employee" <?php echo ($mb['mb_job']) == 'employee ? "selected" : ""; '?>>employee</option>
                        <option value="Teacher" <?php echo ($mb['mb_job']) == 'Teacher ? "selected" : ""; '?>>Teacher</option>
                        <option value="Docter" <?php echo ($mb['mb_job']) == 'Docter ? "selected" : ""; '?>>Docter</option>
                    </select>
                </div>

                <label for="">GENDER</label>
                <div class="mb-3">
                    <div class="form-check form-check-inline">
                        <input type="radio" class="form-check-input" name="mb_gender" id="gender1" value="Man" <?php echo ($mb['mb_gender'] == 'Man') ? "checked" : ""?>>
                        <label for="gender1">Man</label>
                    </div>
                    <div class="form-check form-check-inline">
                        <input type="radio" class="form-check-input" name="mb_gender" id="gender2" value="Woman" <?php echo ($mb['mb_gender'] == 'Woman') ? "checked" : ""?>>
                        <label for="gender2">Woman</label>
                    </div>
                </div>

                <label for="">LANGUAGE</label>
                <div class="mb-3">
                    <div class="form-check form-check-inline">
                        <input type="checkbox" id="mb_language1" name="mb_language[]" class="form-check-input" 
                        value="HTML" <?php echo str_contains($mb['mb_language'], "HTML") ? 'checked' : ''?>>
                        <label for="mb_language1">HTML</label>
                    </div>

                    <div class="form-check form-check-inline">
                        <input type="checkbox" id="mb_language2" name="mb_language[]" class="form-check-input" 
                        value="CSS" <?php echo str_contains($mb['mb_language'], "CSS") ? 'checked' : ''?>>
                        <label for="mb_language1">CSS</label>
                    </div>

                    <div class="form-check form-check-inline">
                        <input type="checkbox" id="mb_language3" name="mb_language[]" class="form-check-input" 
                        value="PHP" <?php echo str_contains($mb['mb_language'], "PHP") ? 'checked' : ''?>>
                        <label for="mb_language3">PHP</label>
                    </div>

                    <div class="form-check form-check-inline">
                        <input type="checkbox" id="mb_language4" name="mb_language[]" class="form-check-input" 
                        value="MYSQL" <?php echo str_contains($mb['mb_language'], "MYSQL") ? 'checked' : ''?>>
                        <label for="mb_language4">MYSQL</label>
                    </div>
                </div>

                <button type="submit" class="btn btn-primary"><?php echo $title?></button>
                <a href="<?php echo $href?>" class="btn btn-danger">Cancel</a>
            </form>
        </div>
    </body>
</html>

register.php 코드는 위와 같다. 

 

완성된 페이지는 위의 사진처럼 생겼다!

 

 

지금까지 본 코드 중에서 가장 긴 느낌이지만 사실 크게 나눠보자면 php & html로 구성되어

(1) php는 session 값의 여부에 따라 변수를 설정하는 역할
(2) html는 회원가입 form을 형성한다.

 

html 내용이 더 많이 포함되어 있고 form을 구성하다 보니 코드가 길어 보이는 것일 뿐!

내용 자체는 그리 복잡하지 않다!

 

 

[ 코드 설명 ]

앞에서 언급했듯이 register.php는

(1) index.php에서 REGISTER 버튼을 클릭했을 때 실행되는 파일인데, 더. 불. 어.
(2) Login 후 member_list.php에서 회원 정보를 수정하고 싶을 시 접근할 수 있는 페이지이기도 하다. 

 

따라서 코드도 (1) & (2) 상황에 따라 알맞게 작성해야 한다는 걸 짚고 넘어가자!

 

 

[ php ]

<?php
include("./dbconn.php");

우선 php부터 살펴보면 상단에서 dbconn.php 파일을 불러오는 걸 볼 수 있다. (include function)

 

 

if(isset($_SESSION['ss_mb_id'])) {
    $mb_id = $_SESSION['ss_mb_id'];
    $sql = "SELECT * FROM member WHERE mb_id = '$mb_id'";
    $result = mysqli_query($conn, $sql);
    $mb = mysqli_fetch_assoc($result);
    mysqli_close($conn);

    $mode = "modify";
    $title = "EDIT info";
    $modify_mb_info = "readonly";
    $href = "./member_list.php";
} else

if-else문은 'ss_mb_id' 세션의 존재 여부로 나뉘게 되는 데

 

'ss_mb_id' 세션이 존재하는 경우 (= login 후, 회원 정보 수정)

세션 값을 $mb_id에 할당하고 해당 id가 데이터베이스에 존재하는지 확인한다. 

id가 존재하면 회원 정보를 연관 배열로 가져오고 연결을 종료한다.

 

데이터베이스에 id가 존재한다는 것은 회원 가입이 아닌 회원 정보 수정이 목적이라는 뜻이기 때문에

그에 맞게 mode, title, modify_mb_info 변수 값을 설정해 준다.

 

$href에는 회원 정보 수정을 마친 후 돌아갈 페이지 주소 값을 할당하면 된다. 

 

 

} else {
    $mode = "insert";
    $title = "REGISTER";
    $modify_mb_info = "";
    $href = "./index.php";
}
?>

else문은 세션 값이 존재하지 않는 경우 실행되는 데 이는 index.php에서 REGISTER 버튼을 누른 경우를 의미한다.


즉 새롭게 회원 가입을 시도하는 경우이기 때문에 그에 맞는 변수 설정을 해준다!
회원 가입을 완료한 후에는 다시 메인 페이지로 이동할 것이기에 href 값을 index.php로 설정한다.

 

 

 

[ html ]

<h4 class="display-4 text-center"><?php echo $title ?></h4>

h4 tag로 title 값을 출력한다. 

 

REGISTER 버튼을 누른 경우에는 REGISTER, 

member_list.php에서 접근하는 경우에는 EDIT info가 출력될 것이다.

 

 

<form action="./register_update.php" method="post">

method 값이 post, action 값이 register_update.php이기 때문에

register.php에서 입력되는 데이터는 post방식으로 register_update.php에 전달될 것이다. 

 

* register_update.php : register.php에 입력된 데이터를 DB에 추가 or 수정하기 위해 동작할 php file

 

 

<input type="hidden" name="mode" value="<?php echo $mode ?>">

value에 $mode 값이 사용되는 걸 볼 수 있다.

type이 hidden이기 때문에 눈에 보이지는 않지만 $mode 값이 register_update.php로 전달될 것!

 

 

<label for="mb_id">ID</label>
<div class="mb-3">
    <input type="text" id="mb_id" name="mb_id" class="form-control" value="<?php echo $mb['mb_id'] ?? '' ?>" <?php echo $modify_mb_info ?>>
</div>

위에서 설명했듯이 이 페이지에 접근하는 경우는 두 가지가 있다.

 

그렇다 보니 $mb가 생성되었느냐(if문), 아니냐(else문)의 여부로

REGISTER or EDIT 상황에 맞게 값을 설정할 필요가 있다.

 

만약 EDIT 상황이라면 $mb가 php if문에서 생성되기 때문에

$mb['mb_id'] 값이 자동적으로 입력란에 작성될 것이고 

 

REGISTER 상황이라면 공백인 상태로 설정된다. 

 

 

<label for="mb_password">PASSWORD</label>
<div class="mb-3">
    <input type="password" id="mb_paswword" name="mb_password" class="form-control">
</div>

<label for="mb_password_re">Check Password</label>
<div class="mb-3">
    <input type="password" id="mb_password_re" class="form-control" name="mb_password_re">
</div>

비밀번호의 경우는 정 수정이든 회원가입이든 변경될 값이기 때문에 

필요한 TAG만 생성해 두고 그 밖의 설정은 하지 않아도 된다.

 

 

<label for="mb_name">NAME</label>
<div class="mb-3">
    <input type="text" class="form-control" id="mb_name" name="mb_name" value="<?php echo $mb['mb_name'] ?? '' ?>">
</div>

 

<label for="mb_email">EMAIL</label>
<div class="mb-3">
    <input type="email" id="mb_email" name="mb_email" class="form-control" value="<?php echo $mb['mb_email'] ?? '' ?>">
</div>

mb_id의 경우와 마찬가지로 회원 정보를 수정하는 경우에는 

이미 데이터베이스에 저장된 정보가 입력란에 작성된 상태로 페이지가 출력되고


회원 가입의 경우에는 공백으로 제공된다. 

 

 

<label>JOB</label>
<div class="mb-3">
    <select name="mb_job" class="form-select">
        <option value="Student" <?php echo ($mb['mb_job']) == 'Student ? "selected" : ""; '?>>Student</option>
        <option value="employee" <?php echo ($mb['mb_job']) == 'employee ? "selected" : ""; '?>>employee</option>
        <option value="Teacher" <?php echo ($mb['mb_job']) == 'Teacher ? "selected" : ""; '?>>Teacher</option>
        <option value="Docter" <?php echo ($mb['mb_job']) == 'Docter ? "selected" : ""; '?>>Docter</option>
    </select>
</div>

직업의 경우는 이때까지의 input과 달리 select tag를 사용해서 여러 option 중 하나를 선택하게 구성되어 있다.

 

이 값도 회원 가입 or 회원 정보 수정 상황에 따라 이미 선택된 값이 있는 경우

해당 option에 selected를 남기고 아닌 경우는 공백 처리한다. 

 

 

<label for="">GENDER</label>
<div class="mb-3">
    <div class="form-check form-check-inline">
        <input type="radio" class="form-check-input" name="mb_gender" id="gender1" value="Man" <?php echo ($mb['mb_gender'] == 'Man') ? "checked" : ""?>>
        <label for="gender1">Man</label>
    </div>
    <div class="form-check form-check-inline">
        <input type="radio" class="form-check-input" name="mb_gender" id="gender2" value="Woman" <?php echo ($mb['mb_gender'] == 'Woman') ? "checked" : ""?>>
        <label for="gender2">Woman</label>
    </div>
</div>

성별을 선택하는 경우에는 radio 유형의 input tag를 사용한다. 

 

만약 회원 정보를 수정하는 경우, 사용자가 남성이라면

$mb['mb_gender'] 값은 Man이기 때문에 value = Man인 input이 checked 되어있을 것이다.

 

 

<label for="">LANGUAGE</label>
<div class="mb-3">
    <div class="form-check form-check-inline">
        <input type="checkbox" id="mb_language1" name="mb_language[]" class="form-check-input" 
        value="HTML" <?php echo str_contains($mb['mb_language'], "HTML") ? 'checked' : ''?>>
        <label for="mb_language1">HTML</label>
    </div>

    <div class="form-check form-check-inline">
        <input type="checkbox" id="mb_language2" name="mb_language[]" class="form-check-input" 
        value="CSS" <?php echo str_contains($mb['mb_language'], "CSS") ? 'checked' : ''?>>
        <label for="mb_language1">CSS</label>
    </div>

    <div class="form-check form-check-inline">
        <input type="checkbox" id="mb_language3" name="mb_language[]" class="form-check-input" 
        value="PHP" <?php echo str_contains($mb['mb_language'], "PHP") ? 'checked' : ''?>>
        <label for="mb_language3">PHP</label>
    </div>

    <div class="form-check form-check-inline">
        <input type="checkbox" id="mb_language4" name="mb_language[]" class="form-check-input" 
        value="MYSQL" <?php echo str_contains($mb['mb_language'], "MYSQL") ? 'checked' : ''?>>
        <label for="mb_language4">MYSQL</label>
    </div>
</div>

관심 언어를 선택하는 경우는 한 번에 여러 개를 선택할 수 있어야 하기 때문에

checkbox 유형의 input tag가 사용되었다. 

 

대신 모두 관심 언어라는 하나의 주제에 대한 값이기 때문에

mb_language[] 배열로 들어가도록 name을 잘 설정해주어야 한다!

 

 

<button type="submit" class="btn btn-primary"><?php echo $title?></button>
<a href="<?php echo $href?>" class="btn btn-danger">Cancel</a>

button tag를 누르면 form tag에 설정된 경로로 지금까지 살펴본 데이터들이 전달된다.

button 문구도 상황에 따라 다르게 출력하고자 $title 값을 활용하고 있는 걸 볼 수 있고

 

a tag는 $href 경로로 이동하도록 링크를 설정하는 데

회원가입의 경우는 다시 로그인 페이지로, 회원 정보 수정의 경우는 member_list.php로 되돌아가게 된다. 

(php 코드에서 설정한 $href 값 대로 이동)

 

 

[ 결과 화면 ]

 

index.php에서 REGISTER 버튼을 누르고 register.php로 이동!

form을 작성하고 회원가입 버튼을 누르면 

 

 

성공적으로 회원가입이 완료되었다는 팝업 창이 뜬다.

 

member table을 확인해 보면 방금 입력한 값이 그대로 추가된 걸 확인할 수 있다.

 

 

REGISTER가 아닌 로그인 후 member_list.php에서 회원정보를 수정하는 경우에는 

비밀번호를 제외한 회원 정보가 입력되어 있는 형태로 FORM이 출력되는 걸 볼 수 있다. 

 

[ Next ]

(1) dbconn.php - 완료!

(2) login_check.php - 완료!

(3) register.php - 완료!

(4) member_list.php

(5) register_update.php

'PHP' 카테고리의 다른 글

php - Mini Project 1 - (6)  (0) 2023.08.02
php - Mini Project 1 - (5)  (0) 2023.08.02
php - Mini Project 1 - (3)  (0) 2023.07.31
php - Mini Project 1 - (2)  (1) 2023.07.31
php - Mini Project 1 - (1)  (0) 2023.07.30
'PHP' Related Articles more
Comments