Nền tảng Kiến thức - Hành trang tới Tương lai
Card image

Chương 6-Bài 6. Thực hiện Trang Liên hệ (có gởi mail thông báo)

Tác giả: Dương Nguyễn Phú Cường #8178
Ngày đăng: Hồi xưa đó
Lượt xem: 85

Step 1: tạo file xử lý Logic cho Trang Liên hệ

  • Tạo file frontend/pages/contact.php
<?php
// Include file cấu hình ban đầu của `Twig`
require_once __DIR__.'/../../bootstrap.php';

// Truy vấn database để lấy danh sách
// 1. Include file cấu hình kết nối đến database, khởi tạo kết nối $conn
include_once(__DIR__.'/../../dbconnect.php');

use PHPMailer\PHPMailer\PHPMailer;
use PHPMailer\PHPMailer\Exception;

if(!isset($_POST['btnGoiLoiNhan']))
{
    // Yêu cầu `Twig` vẽ giao diện được viết trong file `frontend/pages/contact.html.twig`
    // với dữ liệu truyền vào file giao diện được đặt tên
    echo $twig->render('frontend/pages/contact.html.twig');
    return;
}

// Lấy dữ liệu người dùng hiệu chỉnh gởi từ REQUEST POST
$email = $_POST['email'];
$title = $_POST['title'];
$message = $_POST['message'];

// Gởi mail kích hoạt tài khoản
$mail = new PHPMailer(true);                               // Passing `true` enables exceptions
try {
    //Server settings
    //$mail->SMTPDebug = 2;                                // Enable verbose debug output
    $mail->isSMTP();                                       // Set mailer to use SMTP
    $mail->Host = 'smtp.gmail.com';                        // Specify main and backup SMTP servers
    $mail->SMTPAuth = true;                                // Enable SMTP authentication
    $mail->Username = 'hotro.nentangtoituonglai@gmail.com';// SMTP username
    $mail->Password = 'apmcxgzjndlbjybj';                  // SMTP password
    $mail->SMTPSecure = 'tls';                             // Enable TLS encryption, `ssl` also accepted
    $mail->Port = 587;                                     // TCP port to connect to
    $mail->CharSet = "UTF-8";

    // Bật chế bộ tự mình mã hóa SSL
    $mail->SMTPOptions = array(
        'ssl' => array(
            'verify_peer' => false,
            'verify_peer_name' => false,
            'allow_self_signed' => true
        )
    );

    //Recipients
    $mail->setFrom('hotro.nentangtoituonglai@gmail.com', 'Test Mail');
    $mail->addAddress('phucuong@ctu.edu.vn');                // Add a recipient
    $mail->addReplyTo($email);
    // $mail->addCC('cc@example.com');
    // $mail->addBCC('bcc@example.com');

    //Attachments
    // $mail->addAttachment('/var/tmp/file.tar.gz');        // Add attachments
    // $mail->addAttachment('/tmp/image.jpg', 'new.jpg');   // Optional name

    //Content
    $mail->isHTML(true);                                    // Set email format to HTML
    $mail->Subject = "[Có người liên hệ] - $title";
    $siteUrl = siteURL();
    $body = <<<EOT
    Có người liên hệ cần giúp đỡ. <br />
    Email của khách: $email <br />
    Nội dung: <br />
    $message
EOT;
    $mail->Body    = $body;

    $mail->send();
} catch (Exception $e) {
    echo 'Lỗi khi gởi mail: ', $mail->ErrorInfo;
}

// Sau khi cập nhật dữ liệu, tự động điều hướng về trang Đăng ký thành công
// header("location:register-success.php?kh_tendangnhap=$kh_tendangnhap");

Step 2: tạo file template cho Trang Liên hệ

  • Tạo file templates/frontend/pages/contact.html.twig
{# Kế thừa layout frontend #}
{% extends "frontend/layouts/layout.html.twig" %}

{# Nội dung trong block title #}
{% block title %}
Liên hệ
{% endblock %}
{# End Nội dung trong block title #}

{# Nội dung trong block headline #}
{% block headline %}
Liên hệ
{% endblock %}
{# End Nội dung trong block headline #}

{# Nội dung trong block content #}
{% block content %}
<div class="container mt-2">
    <h1 class="text-center">Liên hệ với Nền tảng</h1>
    <div class="row">
        <div class="col col-md-6">
            <img src="/assets/frontend/img/marketing-1.png" />
        </div>
        <div class="col col-md-6">
            <form method="post" action="/frontend/pages/lienhe">
                <div class="form-group">
                    <label for="email">Email của bạn</label>
                    <input type="email" class="form-control" id="email" name="email" placeholder="Email của bạn">
                </div>
                <div class="form-group">
                    <label for="title">Tiêu đề của bạn</label>
                    <input type="text" class="form-control" id="title" name="title" placeholder="Tiêu đề của bạn">
                </div>
                <div class="form-group">
                    <label for="message">Lời nhắn của bạn</label>
                    <textarea name="message" class="form-control"></textarea>
                </div>
                <button class="btn btn-primary" name="btnGoiLoiNhan">Gởi lời nhắn</button>
            </form>
        </div>
    </div>
    <div class="row mt-2">
        <div class="col col-md-12">
            <iframe
                src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3928.7235485722294!2d105.78061631523369!3d10.039656175103817!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x31a062a768a8090b%3A0x4756d383949cafbb!2zMTMwIFjDtCBWaeG6v3QgTmdo4buHIFTEqW5oLCBBbiBI4buZaSwgTmluaCBLaeG7gXUsIEPhuqduIFRoxqEsIFZp4buHdCBOYW0!5e0!3m2!1svi!2s!4v1556697525436!5m2!1svi!2s"
                width="100%" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
        </div>
    </div>
</div>
{% endblock %}
{# End Nội dung trong block content #}

{% block customscripts %}
{% endblock %}
     

Chương trình học


  1. Bức tranh tổng thể về Lập trình WEB 1
    1. Sơ đồ vận hành của một Website #1311
  2. Cài đặt môi trường Lập trình PHP 1
    1. Các chương trình cần thiết để Lập trình Web #8136
  3. Thực hiện Dự án PHP thực tế mẫu - sử dụng TWIG template
  4. Dự án thực tế mẫu (TWIG template) - Trang web bán hàng trực tuyến - Thiết kế CSDL 3
    1. Mô hình thiết kế CSDL mẫu NetaShop #7896
    2. Tạo cấu trúc (schema) database netashop #7897
    3. Tạo dữ liệu mẫu (data seed / dummy data) cho netashop #7898
  5. Dự án thực tế mẫu (TWIG template) - Trang web bán hàng trực tuyến - Thiết kế Backend 6
    1. Thiết kế bố cục (layouts) cho giao diện Backend #7900
    2. Tạo chức năng CRUD (Thêm, Sửa, Xóa, Xem) danh mục phẳng #8180
    3. Tạo chức năng CRUD (Thêm, Sửa, Xóa, Xem) danh mục có liên kết khóa ngoại #8183
    4. Tạo chức năng CRUD (Thêm, Sửa, Xóa, Xem) upload hình Sản phẩm (upload đơn, mỗi lần 1 file) #8186
    5. Tạo API lấy dữ liệu báo cáo thống kê #8194
    6. Tạo trang Dashboard #8199
  6. Dự án thực tế mẫu (TWIG template) - Trang web bán hàng trực tuyến - Thiết kế Frontend 11
    1. Thiết kế bố cục (layouts) cho giao diện Frontend #8158
    2. Thực hiện Trang chủ Frontend #8160
    3. Thực hiện Trang Đăng nhập Login #8164
    4. Thực hiện Trang Đăng ký Register #8167
    5. Thực hiện chức năng Kích hoạt Tài khoản #8174
    6. Thực hiện Trang Liên hệ (có gởi mail thông báo) #8178
    7. Thực hiện chức năng Đăng xuất #8192
    8. Thực hiện Trang chi tiết Sản phẩm #8213
    9. Thực hiện Xử lý cho phép Đặt hàng trong trang Chi tiết Sản phẩm #8215
    10. Thực hiện Trang Giỏ hàng #8218
    11. Thực hiện Trang tìm kiếm Sản phẩm #8225
Các bài học

Chương trình học

Bao gồm Module, Chương, Bài học, Bài tập, Kiểm tra...

Chương trình học


  1. Bức tranh tổng thể về Lập trình WEB 1
    1. Sơ đồ vận hành của một Website #1311
  2. Cài đặt môi trường Lập trình PHP 1
    1. Các chương trình cần thiết để Lập trình Web #8136
  3. Thực hiện Dự án PHP thực tế mẫu - sử dụng TWIG template
  4. Dự án thực tế mẫu (TWIG template) - Trang web bán hàng trực tuyến - Thiết kế CSDL 3
    1. Mô hình thiết kế CSDL mẫu NetaShop #7896
    2. Tạo cấu trúc (schema) database netashop #7897
    3. Tạo dữ liệu mẫu (data seed / dummy data) cho netashop #7898
  5. Dự án thực tế mẫu (TWIG template) - Trang web bán hàng trực tuyến - Thiết kế Backend 6
    1. Thiết kế bố cục (layouts) cho giao diện Backend #7900
    2. Tạo chức năng CRUD (Thêm, Sửa, Xóa, Xem) danh mục phẳng #8180
    3. Tạo chức năng CRUD (Thêm, Sửa, Xóa, Xem) danh mục có liên kết khóa ngoại #8183
    4. Tạo chức năng CRUD (Thêm, Sửa, Xóa, Xem) upload hình Sản phẩm (upload đơn, mỗi lần 1 file) #8186
    5. Tạo API lấy dữ liệu báo cáo thống kê #8194
    6. Tạo trang Dashboard #8199
  6. Dự án thực tế mẫu (TWIG template) - Trang web bán hàng trực tuyến - Thiết kế Frontend 11
    1. Thiết kế bố cục (layouts) cho giao diện Frontend #8158
    2. Thực hiện Trang chủ Frontend #8160
    3. Thực hiện Trang Đăng nhập Login #8164
    4. Thực hiện Trang Đăng ký Register #8167
    5. Thực hiện chức năng Kích hoạt Tài khoản #8174
    6. Thực hiện Trang Liên hệ (có gởi mail thông báo) #8178
    7. Thực hiện chức năng Đăng xuất #8192
    8. Thực hiện Trang chi tiết Sản phẩm #8213
    9. Thực hiện Xử lý cho phép Đặt hàng trong trang Chi tiết Sản phẩm #8215
    10. Thực hiện Trang Giỏ hàng #8218
    11. Thực hiện Trang tìm kiếm Sản phẩm #8225

Bài học trước Bài học tiếp theo