Tiếp theo của:
Ngu ngơ học làm web (108) - Upload tập tin trong PHP
-----
Phần 109. PDO
- thêm dữ liệu vào CSDL
Xem và làm theo clip số 16 của thầy Nguyễn Anh Tuấn:
Phần này có kiểm tra xem người dùng đã nhập thông tin cho
các ô nhập liệu hay chưa? sử dụng Javascript, ví dụ ở đây là kiểm tra phần nhập
Tên món ăn, việc kiểm tra được thực hiện khi người dùng bấm nút Lưu.
<td colspan="4"
align="center"><input type="submit"
value="Lưu" name="th_luu" onclick="return
kiem_tra_mon_an()"></td>
Đây là nội dung của tập tin thuvien.js,
function kiem_tra_mon_an() {
var ten_mon =
document.getElementById('th_ten_mon');
if(ten_mon.value
== ""){
alert('Nhập
tên món ăn');
ten_mon.focus();
return
false;
}
return true;
}
Đây là nội dung của tập tin default.css,
body { background: #ccc; }
h1 { text-align: center; color: #F00; }
#main { width: 700px; margin: 0 auto; border: #f00 solid 1px;
background: #fff; }
.khung { width: 680px; height: 200px; border-bottom: #999 solid
1px; padding: 10px; }
.khung img { width: 250px; float: left; margin-right: 10px; }
Đây là nội dung của tập tin connection.php,
<?php
try
{
//Khai báo đối
tượng PDO
$pdo = new
PDO("mysql:host=localhost;dbname=ql_nha_hang","root","");
//Xuất tiếng
Việt
$pdo->query("SET
NAMES UTF8");
}
catch (PDOException $ex)
{
die($ex->getMessage());
}
?>
Đây là nội dung của tập tin them_mon_an.php,
<!DOCTYPE html>
<html lang="en">
<head>
<meta
charset="UTF-8">
<title>Thêm
món ăn</title>
<link
rel="stylesheet" href="default.css">
<script
src="thuvien.js"></script>
</head>
<?php
include("connection.php");
$err = '';
//Đọc bảng loại
món ăn
$sql =
"SELECT ma_loai, ten_loai FROM loai_mon_an";
//Tạo một
prepared statement
$stmt =
$pdo->prepare($sql);
//Thực thi
prepared statement
$stmt->execute();
//Chuyển kết quả
truy vấn sang một đối tượng
if($stmt->rowcount()
> 0){
$loai_mon
= $stmt->fetchAll(PDO::FETCH_OBJ);
}
if(isset($_POST['th_luu'])){
//Lấy
thông tin từ form gán vào các biến
$ma_mon
= NULL;
$ma_loai
= $_POST['th_ma_loai'];
$ten_mon
= $_POST['th_ten_mon'];
$noi_dung_tom_tat
= $_POST['th_noi_dung_tom_tat'];
$noi_dung_chi_tiet
= $_POST['th_noi_dung_chi_tiet'];
$don_gia
= $_POST['th_don_gia'];
$don_gia_khuyen_mai
= $_POST['th_don_gia_khuyen_mai'];
$khuyen_mai
= $_POST['th_khuyen_mai'];
$hinh
= $_FILES['th_hinh']['error'] == 0 ? $_FILES['th_hinh']['name'] : '';
$ngay_cap_nhat
= $_POST['th_ngay_cap_nhat'];
$dvt
= $_POST['th_dvt'];
$trong_ngay =
$_POST['th_trong_ngay']=='on' ? 1 : 0;
//Tạo
lệnh thêm dữ liệu vào CSDL
$sql
= 'INSERT INTO mon_an VALUES(?,?,?,?,?,?,?,?,?,?,?,?)';
//Khai
báo mảng tham số
$param
= array($ma_mon, $ma_loai, $ten_mon, $noi_dung_tom_tat, $noi_dung_chi_tiet,
$don_gia, $don_gia_khuyen_mai, $khuyen_mai, $hinh, $ngay_cap_nhat, $dvt,
$trong_ngay);
$stmt
= $pdo -> prepare($sql);
$kq
= $stmt -> execute($param);
if($kq){
$err
= 'Thêm dữ liệu thành công!';
//Di
chuyển hình về thư mục chứa hình
if($hinh
!=''){
$kt
= move_uploaded_file($_FILES['th_hinh']['tmp_name'], "images/$hinh");
if($kt){
$err
.= 'upload hình thành công';
}else{
$err
.= 'upload hình không thành công';
}
}
}else{
$err
= 'Quá trình thêm dữ liệu không thành công!';
}
}
?>
<body>
<h3 style="color:red"><?php echo $err;
?></h3>
<div id="main">
<h1>Món ăn
mới</h1>
<form
action="them_mon_an.php" name="ManHinhThemMon"
method="POST" enctype="multipart/form-data">
<table
class="center" cellpadding="2px">
<tr>
<td
width="150px" bgcolor="B0D1EA">Tên món ăn</td>
<td
colspan="3"><input type="text"
name="th_ten_mon" id="th_ten_mon"
style="width:300px" value=""></td>
</tr>
<tr>
<td
bgcolor="B0D1EA">Loại món ăn</td>
<td
colspan="3">
<select
style="width:150px" name="th_ma_loai">
<?php
foreach
($loai_mon as $loai) {
?>
<option
value="<?php echo $loai->ma_loai; ?>"><?php echo
$loai->ten_loai; ?></option>
<?php
}
?>
</select>
</td>
</tr>
<tr>
<td
bgcolor="B0D1EA">Nội dung tóm tắt</td>
<td
colspan="3"> <textarea name="th_noi_dung_tom_tat"
id="th_noi_dung_tom_tat" cols="40"
rows="5"></textarea> </td>
</tr>
<tr>
<td
bgcolor="B0D1EA">Nội dung chi tiết</td>
<td
colspan="3"> <textarea name="th_noi_dung_chi_tiet"
id="th_noi_dung_chi_tiet" cols="40"
rows="5"></textarea> </td>
</tr>
<tr>
<td
bgcolor="B0D1EA">Đơn giá</td>
<td><input
type="text" name="th_don_gia" id="th_don_gia"
style="width:100px" value=""></td>
<td
bgcolor="B0D1EA">Đơn giá khuyến mãi</td>
<td><input
type="text" name="th_don_gia_khuyen_mai"
id="th_don_gia_khuyen_mai" style="width:100px"
value=""></td>
</tr>
<tr>
<td
bgcolor="B0D1EA">Hình</td>
<td
colspan="3"><input type="file"
name="th_hinh" id="th_hinh"
value=""></td>
</tr>
<tr>
<td
bgcolor="B0D1EA">Ngày cập nhật</td>
<td><input
type="text" name="th_ngay_cap_nhat"
id="th_ngay_cap_nhat" style="width:100px"
value=""></td>
<td
bgcolor="B0D1EA">Đơn vị tính</td>
<td><input
type="text" name="th_dvt" id="th_dvt"
style="width:100px" value=""></td>
</tr>
<tr>
<td
bgcolor="B0D1EA">Khuyến mãi</td>
<td><input
type="text" name="th_khuyen_mai"
id="th_khuyen_mai" style="width:100px"
value=""></td>
<td
bgcolor="B0D1EA">Trong ngày</td>
<td><input
type="checkbox" name="th_trong_ngay"
id="th_trong_ngay"></td>
</tr>
<tr>
<td
colspan="4" align="center"><input
type="submit" value="Lưu" name="th_luu"
onclick="return kiem_tra_mon_an()"></td>
</tr>
</table>
</form>
</div>
<?php
$pdo->NULL;
?>
</body>
</html>
Qua phần này sẽ học được các nội dung sau:
- Thiết kế giao diện bằng HTML, CSS (client-side)
- Kiểm tra việc nhập dữ liệu bằng Javascript (client-side)
- Đọc dữ liệu từ cơ sở dữ liệu để hiển thị lên form (server-side)
- Lưu dữ liệu từ form vào cơ sở dữ liệu (server-side)
Để ý sự khác nhau giữa nháy đơn và nháy kép ở đây:
$kt = move_uploaded_file($_FILES['th_hinh']['tmp_name'],
"images/$hinh");
Thử thay là: $kt = move_uploaded_file($_FILES['th_hinh']['tmp_name'],
‘images/$hinh’); rồi chạy lại để xem sự khác nhau.
-----------
Cập nhật 22/2/2017
-----------
Xem thêm:
- Tổng hợp các bài viết về Ngu ngơ học làm web