[Share Code] Chữa bài tập Form + MySQL trong PHP - Lập trình PHP MySQL

#list.php

Name: Học Lập Trình Từ A - Z (HTML/CSS/JS - Bootstrap/JQuery - AngularJS - PHP/Laravel - Java v.v)
Address: Số 8, Tôn Thất Thuyết, Mỹ Đình, Từ Liêm, Hà Nội, Nam Từ Liêm, Hà Nội, 100000
Telephone: 0762103668
Price range: $$$

<!DOCTYPE html>
<html>
<head>
	<title>List Page</title>
	<!-- Latest compiled and minified CSS -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

	<!-- jQuery library -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

	<!-- Popper JS -->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

	<!-- Latest compiled JavaScript -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
</head>
<body>
	<div class="container">
		<div class="panel panel-primary">
			<div class="panel-heading">
				<h2 class="text-center">Welcome Page</h2>
			</div>
			<div class="panel-body">
				<table class="table table-bordered">
					<thead>
						<tr>
							<th>Name</th>
							<th>Email</th>
							<th>Password</th>
						</tr>
					</thead>
					<tbody>
<?php
//lay danh sach user trong database
// open connection to database
$con = mysqli_connect('localhost', 'root', '', 'C2002L');

//query
$sql    = "select * from users";
$result = mysqli_query($con, $sql);
$data   = [];
while ($row = mysqli_fetch_array($result, 1)) {
	$data[] = $row;
}

//close connection
mysqli_close($con);
// var_dump($data);

foreach ($data as $row) {
	echo '<tr>
			<td>'.$row['name'].'</td>
			<td>'.$row['email'].'</td>
			<td>'.$row['password'].'</td>
		</tr>';
}
?>
					</tbody>
				</table>
			</div>
		</div>
	</div>
</body>
</html>

#process_form.php

<?php
if (!empty($_POST)) {
	$name = $email = $password = '';

	if (isset($_POST['name'])) {
		$name = $_POST['name'];
	}
	if (isset($_POST['email'])) {
		$email = $_POST['email'];
	}
	if (isset($_POST['password'])) {
		$password = $_POST['password'];
	}
	if (!empty($name) && !empty($email) && !empty($password)) {
		// echo $name.'-'.$email.'-'.$password;
		// die();
		// header('Location: welcome.php?name='.$name.'&email='.$email.'&password='.$password);
		// insert into database
		// open connection to database
		$con = mysqli_connect('localhost', 'root', '', 'C2002L');

		//query
		$sql = "insert into users(name, email, password) values ('$name', '$email', '$password')";
		// echo $sql;
		mysqli_query($con, $sql);

		//close connection
		mysqli_close($con);

		// insert into database
		// echo 'welcome.php?name='.$name.'&email='.$email.'&password='.$password;
		die();
	}
}
// var_dump($_POST);
echo 'failed';

#vidu-ajax.php

<!DOCTYPE html>
<html>
<head>
	<title>Registation Form * Form Tutorial</title>
	<!-- Latest compiled and minified CSS -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

	<!-- jQuery library -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

	<!-- Popper JS -->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

	<!-- Latest compiled JavaScript -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
</head>
<body>
	<div class="container">
		<div class="panel panel-primary">
			<div class="panel-heading">
				<h2 class="text-center">Registation Form - Input User's Detail Information</h2>
			</div>
			<div class="panel-body">
				<form method="post" onsubmit="return submitData();">
					<div class="form-group">
					  <label for="usr">Name:</label>
					  <input required="true" type="text" class="form-control" id="usr">
					</div>
					<div class="form-group">
					  <label for="email">Email:</label>
					  <input required="true" type="email" class="form-control" id="email">
					</div>
					<div class="form-group">
					  <label for="pwd">Password:</label>
					  <input type="password" class="form-control" id="pwd">
					</div>
					<button class="btn btn-success">Register</button>
				</form>
			</div>
		</div>
	</div>
<script type="text/javascript">
	function submitData() {
		// var name = jQuery('#usr').val()
		var name = $('#usr').val()
		var email = jQuery('#email').val()
		var password = jQuery('#pwd').val()

		console.log(name)
		console.log(email)
		console.log(password)

		// for (var i = 10; i >= 0; i--) {
			$.post('process_form.php', {
				name: name,
				email: email,
				password: password
			}, function(data) {
				alert(data)
				// window.open(data, '_self')
			})
		// }

		return false;
	}
</script>
</body>
</html>

#vidu.php

<?php
// TH >> Gửi dữ liệu trực tiếp trên trang này.
// require_once ('process_form.php');
?>

<!DOCTYPE html>
<html>
<head>
	<title>Registation Form * Form Tutorial</title>
	<!-- Latest compiled and minified CSS -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

	<!-- jQuery library -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

	<!-- Popper JS -->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

	<!-- Latest compiled JavaScript -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
</head>
<body>
	<div class="container">
		<div class="panel panel-primary">
			<div class="panel-heading">
				<h2 class="text-center">Registation Form - Input User's Detail Information</h2>
			</div>
			<div class="panel-body">
				<form method="post" action="process_form.php">
					<div class="form-group">
					  <label for="usr">Name:</label>
					  <input required="true" type="text" class="form-control" id="usr" name="name">
					</div>
					<div class="form-group">
					  <label for="email">Email:</label>
					  <input required="true" type="email" class="form-control" id="email" name="email" value="abc@gmail.com">
					</div>
					<div class="form-group">
					  <label for="pwd">Password:</label>
					  <input type="password" class="form-control" id="pwd" name="password" value="123">
					</div>
					<button class="btn btn-success">Register</button>
				</form>
			</div>
		</div>
	</div>
</body>
</html>

#welcome.php

<?php
$name = $email = $password = '';
if (!empty($_GET)) {
	if (isset($_GET['name'])) {
		$name = $_GET['name'];
	}
	if (isset($_GET['email'])) {
		$email = $_GET['email'];
	}
	if (isset($_GET['password'])) {
		$password = $_GET['password'];
	}
}
?>

<!DOCTYPE html>
<html>
<head>
	<title>Welcome Page</title>
	<!-- Latest compiled and minified CSS -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

	<!-- jQuery library -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

	<!-- Popper JS -->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

	<!-- Latest compiled JavaScript -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
</head>
<body>
	<div class="container">
		<div class="panel panel-primary">
			<div class="panel-heading">
				<h2 class="text-center">Welcome Page</h2>
			</div>
			<div class="panel-body">
				<table class="table table-bordered">
					<thead>
						<tr>
							<th>Name</th>
							<th>Email</th>
							<th>Password</th>
						</tr>
					</thead>
					<tbody>
						<tr>
							<td><?=$name?></td>
							<td><?=$email?></td>
							<td><?=$password?></td>
						</tr>
					</tbody>
				</table>
			</div>
		</div>
	</div>
</body>
</html>

Phản hồi từ học viên

5

(Dựa trên đánh giá ngày hôm nay)