PHP - Tạo trang đăng ký đơn giản(PHP Simple Register Page).





Như các bạn đã biết hầu hết tất cả các trang web phổ biết đều có một trang đăng ký thành viên. Bài viết này sẽ hướng dẫn các bạn tạo một trang đăng ký đơn giản bằng PHP.











Để bắt đầu xây dựng một trang đăng ký ta sẽ lên một danh sách nhỏ các công việc cần phải thực hiện. Dưới đây là danh sách các công việc ta cần thực hiện.
  • Tạo bảng đăng ký(registration) trên database.
  • Tạo trang Config.php
  • Tạo trang Register.php
  • Tạo trang Register.css
  • Tạo trang Welcome.php
Đầu tiên ta tạo bảng registration trên database như sau:
create table registration
(
    id int not null auto_increment,
    fullname varchar(100) not null,
    email varchar(100) unique not null,
    user varchar(100) unique not null,
    pass varchar(100) not null,
    primary key (id)
)

Tạo trang Config.php
<?php

// Replace the variable values below with your specific database information.
$host = "Host";
$user = "User";
$pass = "Pass";
$db = "Database";

// This part sets up the connection to the database (so you don't need to reopen the connection again on the same page).
$ms = mysql_pconnect($host, $user, $pass);

if ( !$ms )
{
 echo "Error connecting to database.\n";
}

// Then you need to make sure the database you want is selected.
mysql_select_db($db);

?>

Tạo trang Register.php
 <script type="text/javascript">
 
 var reg_fullname = /^[a-zA-Z ]+$/;
 var reg_email = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
 var reg_username = /^[a-zA-Z0-9_\.\-]+$/;
 var reg_password = /^[a-zA-Z0-9~!@#$%^&*()_+|]+$/;
 
 function regexFullName() { 
  var tmp = document.getElementById("tb_fullname").value;
  var isvalid = reg_fullname.test(tmp);
 
  if (!isvalid || tmp == "") {
   document.getElementById("lb_fullname").className = "format_msg";
  } else {
   document.getElementById("lb_fullname").className = "";
  }
 }
 
 function regexEmail() { 
  var tmp = document.getElementById("tb_email").value;
  var isvalid = reg_email.test(tmp);
 
  if (!isvalid || tmp == "") {
   //alert('Invalid email address!');
   document.getElementById("lb_email").className = "format_msg";
  } else {
   document.getElementById("lb_email").className = "";
  }
 }
 
 function regexUser() { 
  var tmp = document.getElementById("tb_username").value;
  var isvalid = reg_username.test(tmp);
 
  if (!isvalid || tmp == "") {
   document.getElementById("lb_username").className = "format_msg";
  } else {
   document.getElementById("lb_username").className = "";
  }
 }
 
 function regexPass() { 
  var tmp = document.getElementById("tb_password").value;
  var isvalid = reg_password.test(tmp);
 
  if (!isvalid || tmp == "") {
   document.getElementById("lb_password").className = "format_msg";
  } else {
   document.getElementById("lb_password").className = "";
  }
 }
 
</script>
<?php

 include('Config.php');
 
 if($_SERVER['REQUEST_METHOD'] == 'POST') {
  $fullname = addslashes($_POST['tb_fullname']);
  $email = addslashes($_POST['tb_email']);
  $username = addslashes($_POST['tb_username']);
  $password = addslashes($_POST['tb_password']);
 
  $sql = "INSERT INTO registration(fullname, email, user, pass) VALUES ('$fullname', '$email', '$username', SHA('$password'))";
 
  if(!mysql_query($sql)) {
   die('Error: ' . mysql_error());
  } else {
   header("location: Welcome.php");
  }
 
 }

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="./Register.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="div_main_register">
<form action="Register.php" method="post" enctype="multipart/form-data" name="register" id="register">


<div id="div_register_header"><label>Register</label>
</div>
<hr />
<div id="div_register_field">
<label id="lb_fullname" >Full Name:</label>

<input name="tb_fullname" id="tb_fullname" type="text" onchange="regexFullName()" onkeydown="regexFullName()" />

<label id="lb_email" >Email:</label>

<input name="tb_email" id="tb_email" type="text" value="" onchange="regexEmail()" onkeypress="regexEmail()" />

<label id="lb_username" >Username:</label>

<input name="tb_username" id="tb_username" type="text" onchange="regexUser()" onkeydown="regexUser()" />

<label id="lb_password">Password:</label>

<input name="tb_password" id="tb_password" type="password" onchange="regexPass()" onkeydown="regexPass()" />

</div>

<div id="div_register_control">
<input name="bt_clear" id="bt_reset" type="submit" value="Reset" /><input name="bt_register" type="submit" value="Register" />
</div>


</form>
</div>
</body>
</html>

Tạo trang Register.css
 #div_main_register {
 float: left;
 padding: 10px;
 margin: 5px;
 border: 1px solid #666;
 
   -moz-border-radius: 5px; /* for Mozilla browsers */
   -webkit-border-radius: 5px; /* for webkit browsers (Chrome, Safari) */
   border-radius: 5px; /* for Opera and others */
   border: 1px solid gray;
   background: #EAEAEA;
   padding: 5px 10px;
}
#div_register_header {
 margin-top: 5px;
 margin-right: 0px;
 margin-bottom: 5px;
 margin-left: 0px;
 font-weight: bold;
}
#div_register_field {
 margin: 10px;
 font-weight: bold;
 font-family: "Courier New", Courier, monospace;
}
#div_register_control {
 text-align: right;
 margin-top: 5px;
 margin-right: 10px;
 margin-bottom: 5px;
 margin-left: 10px;
}
.format_msg {
 font-style: italic;
 font-weight: bold;
 color: #F00;
}

Tạo trang Welcome.php
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
Your registry has success.
</body>
</html>

Bạn có thể download tại link bên dưới.
















Posted by at
Labels: , , , , ,

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)