Hướng dẫn tạo trang đăng ký với PHP và MySQL

Bài viết này mình sẽ hướng dẫn các bạn tạo trang đăng ký mà cụ thể ở ví dụ này là đăng ký thông tin (họ tên, mail, mật khẩu, ngày sinh, giới tính) với PHP và MySQL. Bắt đầu nhé…

Tạo form đăng ký

Ở đây mình sẽ sử dụng Twitter bootstrap Framework để tiết kiệm thời gian cho việc tạo giao diện. Bạn có thể dễ dàng tải miễn phí tại: www.getbootstrap.com. Sau khi tải về bạn tiến hành giải nén sẽ thu được một thư mục gốc (là số kèm phiên bản của framework) chứa 3 thư mục con có cấu trúc như sau:

bootstrap/
├── css/
│ ├── bootstrap.css
│ ├── bootstrap.css.map
│ ├── bootstrap.min.css
│ ├── bootstrap.min.css.map
│ ├── bootstrap-theme.css
│ ├── bootstrap-theme.css.map
│ ├── bootstrap-theme.min.css
│ └── bootstrap-theme.min.css.map
├── js/
│ ├── bootstrap.js
│ └── bootstrap.min.js
└── fonts/
├── glyphicons-halflings-regular.eot
├── glyphicons-halflings-regular.svg
├── glyphicons-halflings-regular.ttf
├── glyphicons-halflings-regular.woff
└── glyphicons-halflings-regular.woff2

Bạn hãy đổi tên thư mục bootstrap (thư mục gốc có thể kèm theo số phiên bản của framework) thành regtuts và chép nó vào thư mục chạy web.

Sau đó bạn tạo thêm tập tin registration.php với nội dung như sau:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <meta content="" name="description">
    <meta content="" name="author">
    <link href="" rel="shortcut icon">
    <title>Registration form</title>
<!-- Bootstrap core CSS -->
    <link href="css/bootstrap.css" rel="stylesheet">
    <link href="css/bootstrap-responsive.css" rel="stylesheet">
</head>
<body>
    <div class="container">
        <div class="well">
            <form action="register.php" class="form-horizontal well" method="post">
            <fieldset>
              <legend>Register Now</legend>
              <h4>It's free and always will be.</h4>
                 <div class="row"> 
                    <div class="col-xs-8">
                    <div class="form-group">
                    <div class="rows">
                        <div class="col-md-8">
                            <div class="col-lg-6">
                                <input class="form-control input-lg" id="fName" name="fName" placeholder="First Name" type="text">
                            </div> 
                            <div class="col-lg-6">
                                <input class="form-control input-lg" id="lName" name="lName" placeholder="Last Name" type="text">
                            </div>
                        </div>
                    </div>
                </div> 
                <div class="form-group">
                    <div class="rows">
                        <div class="col-md-8">
                            <div class="col-lg-12">
                                <input class="form-control input-lg" id="email" name="email" placeholder="Your Email" type="text">
                            </div>
                        </div>
                    </div>
                </div> 
                <div class="form-group">
                    <div class="rows">
                        <div class="col-md-8">
                            <div class="col-lg-12">
                                <input class="form-control input-lg" id="reemail" name="reemail" placeholder="Re-enter Email" type="text">
                            </div>
                        </div>
                    </div>
                </div> 
                <div class="form-group">
                    <div class="rows">
                        <div class="col-md-8">
                            <div class="col-lg-12">
                                <input class="form-control input-lg" id="password" name="password" placeholder="New Password" type=
                                "password">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="rows">
                        <div class="col-md-8">
                            <h4>
                            <div class="col-md-3">
                                <label class="col-lg-4 control-label">Birthday</label>
                            </div> 
                            <div class="col-lg-3">
                                <select class="form-control input-sm" name="month">
                                    <option>Month</option>
                                    <?php
                                        $m = array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec");
                                        foreach ($m as $month) {
                                            echo '<option value='.$month.'>'.$month.'</option>';
                                        }
                                    ?>
                                </select>
                            </div> 
                            <div class="col-lg-3">
                                <select class="form-control input-sm" name="day">
                                    <option>Day</option>
                                <?php 
                                    $d = range(31, 1);
                                    foreach ($d as $day) {
                                        echo '<option value='.$day.'>'.$day.'</option>';
                                    } 
                                ?> 
                                </select>
                            </div> 
                            <div class="col-lg-3">
                                <select class="form-control input-sm" name="year">
                                    <option>Year</option>
                                <?php 
                                    $years = range(2010, 1900);
                                    foreach ($years as $yr) {
                                        echo '<option value='.$yr.'>'.$yr.'</option>';
                                    } 
                                ?> 
                                </select>
                            </div>
                            </h4>
                        </div>
                    </div>
                </div> 
                <div class="form-group">
                    <div class="rows">
                        <div class="col-md-4">
                            <div class="col-lg-6">
                                <div class="radio">
                                    <label><input checked id="optionsRadios1" name="optionsRadios" type="radio" value="Female">Female</label>
                                </div>
                            </div> 
                            <div class="col-lg-6">
                                <div class="radio">
                                    <label><input id="optionsRadios2" name="optionsRadios" type="radio" value="Male"> Male</label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div> 
                <div class="form-group">
                    <div class="rows">
                        <div class="col-md-8">
                            <div class="col-lg-12">
                                <button class="btn btn-success btn-lg" type="submit">Register</button>
                            </div>
                        </div>
                    </div>
                </div> 
                </div> 
                </div>  
                </fieldset>
            </form>
        </div>
    </div><!-- container -->
</body>
</html>

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

<!DOCTYPE html>

<head>

<title>Registration form</title>

</head>

<body>

<legend>Register Now</legend>

<h4>It's free and always will be.</h4>

</div>

</div>

</div>

</div>

<input class="form-control input-lg" id="password" name="password" placeholder="New Password" type=

"password">

</div>

<h4>

<label class="col-lg-4 control-label">Birthday</label>

</div>

<option>Month</option>

<?php

$m = array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec");

foreach ($m as $month) {

echo '<option value='.$month.'>'.$month.'</option>';

}

</select>

</div>

<?php

$d = range(31, 1);

foreach ($d as $day) {

echo '<option value='.$day.'>'.$day.'</option>';

}

</select>

</div>

<?php

$years = range(2010, 1900);

foreach ($years as $yr) {

echo '<option value='.$yr.'>'.$yr.'</option>';

}

</select>

</div>

</h4>

</div>

<label><input checked id="optionsRadios1" name="optionsRadios" type="radio" value="Female">Female</label>

</div>

</div>

<button class="btn btn-success btn-lg" type="submit">Register</button>

</div>

</fieldset>

</form>

</div>

</div>

</body>

</html>

Và đây là kết quả thu được

Tạo cơ sở dữ liệu

Bạn tạo cơ sở dữ liệu có tên studentdb. Bạn chạy tiếp đoạn mã SQL dưới đây trong cơ sở dữ liệu vừa tạo để tạo các bảng.

CREATE TABLE IF NOT EXISTS `tblmember` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`fName` varchar(30) NOT NULL,
`lName` varchar(30) NOT NULL,
`email` varchar(50) NOT NULL,
`password` varchar(60) NOT NULL,
`birthdate` text NOT NULL,
`gender` varchar(20) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=1;

CREATE TABLE IF NOT EXISTS `tblmember` (

`id` int(11) NOT NULL AUTO_INCREMENT,

`fName` varchar(30) NOT NULL,

`lName` varchar(30) NOT NULL,

`email` varchar(50) NOT NULL,

`password` varchar(60) NOT NULL,

`birthdate` text NOT NULL,

`gender` varchar(20) NOT NULL,

PRIMARY KEY (`id`)

) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=1;

Tạo trang xử lý

Bạn tạo một tập tin mới với tên register.php (trong thư mục regtuts) với nội dung như sau:

<?php
//set up mysql connection
mysql_connect("localhost", "root", "") or die(mysql_error());
//select database
mysql_select_db("studentdb") or die(mysql_error()); 
$fName     = $_POST['fName'];
$lName     = $_POST['lName'];
$email     = $_POST['email'];
$reemail   = $_POST['reemail'];
$password  = sha1($_POST['password']);
$month     = $_POST['month'];
$day       = $_POST['day'];
$year      = $_POST['year'];
$gender    = $_POST['optionsRadios'];
$birthdate = $year . '-' . $month . '-' . $day;
$query = "INSERT INTO tblmember(id, fName, lName, email, password, birthdate, gender) 
VALUES (NULL, '{$fName}', '{$lName}', '{$email}', '{$password}', '{$birthdate}', '{$gender}')"; 
if (mysql_query($query)) {
echo "<script type=\"text/javascript\">
alert(\"New member added successfully.\");
window.location = \"registration.php\"
</script>";
} else
die("Failed: " . mysql_error());
?>

<?php

//set up mysql connection

mysql_connect("localhost", "root", "") or die(mysql_error());

//select database

mysql_select_db("studentdb") or die(mysql_error());

$fName = $_POST['fName'];

$lName = $_POST['lName'];

$email = $_POST['email'];

$reemail = $_POST['reemail'];

$password = sha1($_POST['password']);

$month = $_POST['month'];

$day = $_POST['day'];

$year = $_POST['year'];

$gender = $_POST['optionsRadios'];

$birthdate = $year . '-' . $month . '-' . $day;

$query = "INSERT INTO tblmember(id, fName, lName, email, password, birthdate, gender)

VALUES (NULL, '{$fName}', '{$lName}', '{$email}', '{$password}', '{$birthdate}', '{$gender}')";

if (mysql_query($query)) {

echo "<script type=\"text/javascript\">

alert(\"New member added successfully.\");

window.location = \"registration.php\"

</script>";

} else

die("Failed: " . mysql_error());

Vậy là xong rồi đó. Giờ bạn truy cập vào tập tin registration.php điền thông tin và submit thử.

Các bạn có thể tải mã nguồn mẫu tại:

Box: http://tinyurl.com/jlj257c
Mediafire: http://tinyurl.com/z5vnbwt

Chúc các bạn thành công

Huỳnh Mai Anh Kiệt

- Advertisement -

Hướng dẫn tạo trang đăng ký với PHP và MySQL

BÌNH LUẬN Hủy trả lời

BÀI VIẾT MỚI

Cập nhật giá vàng SJC dễ dàng ngay trên trình duyệt

Top 4 Ứng Dụng Tạo Trang Miễn Phí Tốt nhất Trên Shopify

Truy tìm thông tin các tài quản trị của 1 trang web WordPress

Bộ cẩm nang về bảo vệ trẻ em trên không gian mạng

Shopify Kéo Dài Chương Trình Dùng Thử Lên Đến 3 Tháng

BẠN XEM CHƯA

Đổi mật khẩu tài khoản Zalo

Lấy thông tin chi tiết của khách viếng thăm từ IP bằng JavaScript

Cách upload hình ảnh lên Instagram từ máy tính

Battle Realms

Thay đổi kích thước cửa sổ dễ dàng với Windows Size

BẠN XEM CHƯA

Biến máy tính cá nhân thành trung tâm giải trí số quá đơn giản

Quán cơm chay từ thiện 2000 đồng chùa Tường Quang – Quy Nhơn

Đổi iPhone cũ lấy iPhone mới tại FPT Shop Bình Định

BÀI VIẾT XEM NHIỀU

Làm sao biết ai đó đang cố tình né bạn trên Facebook

Cách đăng bài hàng loạt lên nhiều group trên Facebook

Khôi phục ảnh bị nhòe vói SmartDeblur

DANH MỤC

THÔNG TIN

THEO DÕI CHÚNG TÔI

Hướng dẫn tạo trang đăng ký với PHP và MySQL

BÀI VIẾT LIÊN QUAN

BÌNH LUẬN Hủy trả lời

BÀI VIẾT MỚI

BẠN XEM CHƯA

BẠN XEM CHƯA

BÀI VIẾT XEM NHIỀU

DANH MỤC

THÔNG TIN

THEO DÕI CHÚNG TÔI