[BÀI 36] HƯỚNG DẪN VIẾT MỘT TRANG WEB CƠ BẢN (PHẦN 5: VIẾT CHỨC NĂNG QUẢN LÝ KHÓA HỌC)
http://laptrinhphp.vn/bai-36-huong-dan-viet-mot-trang-web-co-ban-phan-5-viet-chuc-nang-quan-ly-khoa-hoc/
[BÀI 36] HƯỚNG DẪN VIẾT MỘT TRANG WEB CƠ BẢN (PHẦN 5: VIẾT CHỨC NĂNG QUẢN LÝ KHÓA HỌC)
[BÀI 36] HƯỚNG DẪN VIẾT MỘT TRANG WEB CƠ BẢN (PHẦN 5: VIẾT CHỨC NĂNG QUẢN LÝ KHÓA HỌC)
Trang web tôi đang hướng dẫn các bạn viết là một trang landing page của Devpro.edu.vn, trung tâm chúng tôi chuyên đào tạo lập trình PHP, Android, IOS, đồ họa,… chuyên nghiệp với các chuyên gia nhiều năm kinh nghiệm. Ở trang này có phần quản lý các khóa học mà bên Devpro đang mở lớp, và bài viết sau đây tôi sẽ giới thiệu các bạn quản lý các khóa học này như thế nào!
Một khóa học cơ bản sẽ có các thông tin sau:
Hình ảnh đại diện cho khóa học.
Tên khóa học.
Mức giá hiện tại của khóa học.
…
Các chức năng quản lý cơ bản một khóa học: thêm, sửa, xóa khóa học.
Với các thông tin như tôi mô tả ở trên, tôi phải tạo một bảng mới trong database để quản lý các thông tin này:
Tạo một bảng có tên: “khoahoc”
Bảng khóa học sẽ có các trường sau: id (kiểu int, là khóa chính, tự động tăng), img (kiểu varchar 200, để lưu ảnh đại diện của khóa học), ten (kiểu varchar 50 để lưu tên khóa học), gia (kiểu int, để lưu giá của khóa học).
Sau khi tạo bảng xong, cấu trúc bảng sẽ như sau:
Chỉnh sửa lại link quản lý khóa học:
Trong file admin/layout/layout.php tôi sửa lại link của phần “danh sách khóa học” như hình sau:
Chi tiết như sau:
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167 | <!DOCTYPE html> <html> <head> <title>'Trang quản trị'</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <link rel="stylesheet" href="public/style.css"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body><div id="wrapper"> <!-- start avigation --> <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="index.php">'QUẢN TRỊ HỆ THỐNG'</a> </div> <!-- end avigation --> <!-- start top menu --> <ul class="nav navbar-right top-nav"> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="glyphicon glyphicon-user"></i> 'Xin chào: <?php if(isset($_SESSION["loged"])) echo $_SESSION["loged"]; ?>'<b class="caret"></b></a> <ul class="dropdown-menu"> <li> <a href="index.php?controller=users&act=danhsach_users"><i class="glyphicon glyphicon-list-alt"></i> 'Danh sách tài khoản'</a> </li> <li> <a href="index.php?controller=users&act=hoso"><i class="glyphicon glyphicon-user"></i> 'Hồ sơ cá nhân'</a> </li> <li> <a href="index.php?controller=users&act=add"><i class="glyphicon glyphicon-plus-sign"></i> 'Thêm tài khoản'</a> </li> <li class="divider"></li> <li> <a href="index.php?act=logout"><i class="glyphicon glyphicon-off"></i> 'Đăng xuất'</a> </li> </ul> </li> </ul> <!-- end top menu --> <!-- start menu left --> <div class="collapse navbar-collapse navbar-ex1-collapse"> <ul class="nav navbar-nav side-nav"> <li style="background:#52bc89;color:#fff;"> <a href="#" style="color:#fff;"><i class="glyphicon glyphicon-folder-open"></i> 'Danh mục'</a> </li> <li> <a href="javascript:;" data-toggle="collapse" data-target="#demo_dmcc"><i class="glyphicon glyphicon-picture"></i> Banner <i class="glyphicon glyphicon-chevron-down"></i></a> <ul id="demo_dmcc" class="collapse"> <li> <a href="index.php?controller=banner&act=danhsach">'Danh sách banner'</a> </li> <li> <a href="index.php?controller=banner&act=add">'Thêm banner mới'</a> </li> </ul> </li> <li> <a href="javascript:;" data-toggle="collapse" data-target="#demo_dm"><i class="glyphicon glyphicon-picture"></i>' Danh sách khóa học '<i class="glyphicon glyphicon-chevron-down"></i></a> <ul id="demo_dm" class="collapse"> <li> <a href="index.php?controller=khoahoc&act=danhsach">'Danh sách'</a> </li> <li> <a href="index.php?controller=khoahoc&act=add">'Thêm mới'</a> </li> </ul> </li> <li> <a href="javascript:;" data-toggle="collapse" data-target="#demo_dmm"><i class="glyphicon glyphicon-sunglasses"></i>' Dịch vụ của chúng tôi '<i class="glyphicon glyphicon-chevron-down"></i></a> <ul id="demo_dmm" class="collapse"> <li> <a href="#">'Danh sách'</a> </li> <li> <a href="#">'Thêm'</a> </li> </ul> </li> <li> <a href="javascript:;" data-toggle="collapse" data-target="#demo_bv"><i class="glyphicon glyphicon-globe"></i> 'Thông tin về Devpro' <i class="glyphicon glyphicon-chevron-down"></i></a> <ul id="demo_bv" class="collapse"> <li> <a href="#">'Chi tiết'</a> </li> </ul> </li> <li> <a href="javascript:;" data-toggle="collapse" data-target="#demo_a1"><i class="glyphicon glyphicon-camera"></i> 'Thông tin liên hệ' <i class="glyphicon glyphicon-chevron-down"></i></a> <ul id="demo_a1" class="collapse"> <li> <a href="#">'Chi tiết'</a> </li> </ul> </li> <li> <a href="javascript:;" data-toggle="collapse" data-target="#demo_a2"><i class="glyphicon glyphicon-tag"></i> 'Tin nhắn học viên' <i class="glyphicon glyphicon-chevron-down"></i></a> <ul id="demo_a2" class="collapse"> <li> <a href="#">'Danh sách'</a> </li> </ul> </li> <li> <a href="javascript:;" data-toggle="collapse" data-target="#demo_a456"><i class="glyphicon glyphicon-star-empty"></i> Design <i class="glyphicon glyphicon-chevron-down"></i></a> <ul id="demo_a456" class="collapse"> <li> <a href="#">'Để nâng cấp website, liên hệ:'</a> <a href="http://facebook.com/trung.hongoc">'Hồ Ngọc Trung'</a> <a href="#">0969 540 038</a> </li> </ul> </li> </ul> </div> </nav> <!-- end menu left --> <!-- 'start nội dung' --> <div id="page-wrapper"> <div class="container-fluid"> <?php //gọi controller động: $duongdan_controller=""; if(isset($_GET["controller"])){ $duongdan_controller="controller/controller_".$_GET["controller"].".php"; if(file_exists($duongdan_controller)) include $duongdan_controller; } ?> </div> </div> <!-- 'end nội dung' --> </div></body></html> |
Giao diện trang thêm một khóa học mới:
Hoàn tất 2 việc trên tôi tiến hành thực hiện tiếp:
Tạo thư mục “khoahoc” nằm trong thư mục admin/view/
Tạo file “add.php” nằm trong thư mục admin/view/khoahoc/ để viết giao diện cho trang thêm
Trang admin/view/khoahoc/add.php tôi sẽ viết như sau:
12345678910111213141516171819202122232425262728293031323334 | <div class="panel panel-default"> <div class="panel-heading">'Thêm Khóa học mới'</div> <div class="panel-body"> <form class="form-horizontal" action="" method="post" enctype="multipart/form-data"> <div class="form-group"> <label class="control-label col-sm-2" for="email">'Nhấn chọn hình ảnh:'</label> <div class="col-sm-10"> <input type="file" required name="img" class="form-control"> </div> </div> <div class="form-group"> <label class="control-label col-sm-2" for="email">'Tên khóa học:'</label> <div class="col-sm-10"> <input type="text" required name="ten" class="form-control"> </div> </div> <div class="form-group"> <label class="control-label col-sm-2" for="email">'Giá:'</label> <div class="col-sm-10"> <input type="number" required name="gia" class="form-control"> </div> </div> <div class="form-group"> <div class="col-sm-offset-2 col-sm-10"> <button type="submit" class="btn btn-default" name="add_khoahoc">'Thêm'</button> </div> </div> </form> </div></div> |
Controller thêm khóa học mới:
Trước khi tạo controller tôi tạo một thư mục tên là “khoahoc” nằm trong thư mục “imgs/” để lưu các hình ảnh về khóa học:
cấu trúc folder như sau:
Tiếp đến tôi tạo một file có tên là controller_khoahoc.php trong admin/controller, file này tôi viết như sau:
123456789101112131415161718192021222324252627282930313233343536373839404142434445 | <?php class controller_khoahoc extends controller { public function __construct(){ parent::__construct(); if(isset($_GET["act"])){ $act = $_GET["act"]; //chức năng thêm: if($act =="add"){ include "view/khoahoc/add.php"; //gọi hàm thêm khóa học: if(isset($_POST["add_khoahoc"])) $this->add_khoahoc(); } } } //hàm thêm khóa học mới: public function add_khoahoc(){ if(isset($_FILES['img'])&&$_FILES['img']["name"]!=null){ //lấy tên của file: $t = time(); $file_name=$t."_".$_FILES['img']["name"]; //lấy nội dung của file: $file_tmp =$_FILES['img']['tmp_name']; //tạo đường dẫn lưu file: $path ="../imgs/khoahoc/".$file_name; $dd= "imgs/khoahoc/".$file_name; //upload nội dung file vào đường dẫn vừa tạo: move_uploaded_file($file_tmp,$path); $ten = $_POST["ten"]; $gia = $_POST["gia"]; //lưu dữ liệu vào database: $this->model->query(" insert into khoahoc (img,ten,gia) values ('$file_name','$ten','$gia') "); header("location:index.php?controller=khoahoc&act=danhsach"); } } } new controller_khoahoc();?> |
Viết trang hiển thị danh sách khóa học:
Trong thư mục admin/view/khoahoc/ tôi tạo một file có tên là “list.php” để hiển thị danh sách các khóa học, file này tôi viết như sau:
Last updated
