Chỉnh Sửa Thông Tin

Trong bài học trước chúng ta đã tạo trang admin.php để hiển thông tin sinh viên. Ở bài này và bài tiếp theo bạn sẽ được hướng dẫn cách tạo một trang để chỉnh sửa thông tin của sinh viên và sau đó lưu thông tin này trên database.

Mockup

Mockup là thuật ngữ trong ngành lập trình và thiết kế Web. Mockup là file ảnh hoặc photoshop được dùng để giúp lập trình viên hình thành cái nhìn ban đầu về hình dáng trang web sẽ xây dựng. Việc này sẽ gúp lập trình viên có thể chủ động định hình được những tính năng cần làm. Dưới đây là hình ảnh mockup trang chỉnh sửa thông tin sinh viên:

Trang mockup

Như vậy bạn có thể hình dùng là ở trang chỉnh sửa thông tin này, chúng ta sẽ cần tạo một biểu mẫu HTML với các trường MSSV, Họ và Tên...

Cấu Trúc Đường Dẫn URL

Do chúng ta sẽ có nhiều sinh viên khác nhau trên CSDL và mỗi sinh viên sẽ ứng với một trang chỉnh sửa khác nhau. Tuy nhiên đây cũng chính là sự khác biêt giữa PHP và HTML đó là PHP cho phép lập trình viên chỉ càn tạo một file PHP duy nhất và có thể dùng nó để chỉnh sửa thoogn tin của nhiều sinh viên khác nhau.

Để làm điều này chúng ta sẽ sử dụng khái niệm Query String. Query String được dùng trong địa chỉ đường dẫn URL để giúp Web server xác định được địa chỉ của tài nguyên trên máy chủ. Ví dụ với URL như sau:

http://localhost/hoclaptrinh_org/edit.php?code=15200

Thì Query String sẽ là ?code=15200 và chúng ta gọi codeQuery Parameter với giá trị là 15200. Dựa vào giá trị này, chúng ta sẽ có thể lập trình để tìm trên CSDL sinh viên nào tương ứng với MSSV này.

Tạo Trang Chỉnh Sửa Thông Tin

Bây giờ mở text editor và tạo một file edit.php với nội dung như sau:

<html>
<head>
    <title>Chỉnh Sửa Thông Tin Sinh Viên</title>
    <meta charset="utf-8">
</head>
<body>
<h2>Chỉnh Sửa Thông Tin Sinh Viên</h2>

<?php
    require('connect_db.php');

    if (isset($_GET['code']))
        $code = $_GET['code'];
    else
        die('Thiếu mã số sinh viên!');
?>

</body>
</html>

Ở đoạn mã trên trước hết chúng ta chèn file connect.php để thực hiện việc kết nối với CSDL giống như trước đây:

require('connect_db.php');

Tiếp theo, chúng ta kiểm tra xem trong query string có tồn tại thông số code hay không nếu có thì chúng ta sẽ gán giá trị này cho biến $code ngược lại chúng ta sẽ chấm dứt việc thực thi mã lệnh với và hiển thông báo thiếu mã số sinh viên:

if (isset($_GET['code']))
    $code = $_GET['code'];
else
    die('Thiếu mã số sinh viên!');

Bây giờ nếu bạn truy cập vào trang edit.php mà không truyền vào bất kỳ query parameter nào bạn sẽ thấy trình duyệt hiển thị kết quả sau:

PHP Query String

Truy Vấn CSDL Sử Dụng Query Parameter

Bây giờ bạn cập nhật mã lệnh trong file edit.php theo như dưới đây:

// query students table
$sql = "SELECT * FROM `students` where code = $code";

$result = mysqli_query($link, $sql);

if(!$result) {
    die('Query error: [' . $link->error . ']');
}
$row = mysqli_fetch_array($result, MYSQLI_ASSOC);

if (!$row)
    die('Không có sinh viên nào tồn tại với MSSV bạn cung cấp');
else
    echo $row['fullname'];

Câu lệnh trên về cơ bản này không có gì khác với phần hiển thị thông tin trước tuy nhiên câu truy vấn SQL đã được thay đổi một chút:

$sql = "SELECT * FROM `students` where code = $code";

Ở đây chúng ta sử dụng giá trị của biến $code lấy từ query string trong URL và tìm trên CSDL thông tin của sinh viên có mã số bằng với giá trị của biến này. Bây giờ nếu bạn truy cập trang edit.php và truyền vào parameter code với giá trị là 15200. Bạn sẽ thấy kết quả như sau:

Truy Vấn CSDL Sử Dụng Query Parameter

Tạo Form Chỉnh Sửa Thông Tin

Tiếp theo chúng ta sẽ sử dụng PHP để tạo được biểu mẫu HTML dựa trên thông tin trả về từ database. Comment đoạn mã hiển thị họ và tên sinh viên ở trên:

if (!$row)
    die('Không có sinh viên nào tồn tại với MSSV bạn cung cấp');
// else
//  echo $row['fullname'];

Đồng thời thêm đoạn mã sau ngay trước thẻ đóng </body>:

<form action="save.php">
    <p>
        <label for="code">MSSV:</label>
        <input id="code" name="code" type="text" value="<?php echo $row['code'] ;?>">
    </p>
    <p>
        <label for="fullname">Họ & Tên:</label>
        <input id="fullname" name="fullname" type="text" value="<?php echo $row['fullname'] ;?>">
    </p>
    <p>
        <label for="dob">Ngày Sinh:</label>
        <input id="dob" name="dob" type="text" value="<?php echo $row['dob'] ;?>">
    </p>
    <p>
        <label for="gpa">Điểm Trung Bình:</label>
        <input id="gpa" name="gpa" type="text" value="<?php echo $row['gpa'] ;?>">
    </p>
    <p>
        <input type="submit" value="Cập nhật">
    </p>
</form>

Ở đoạn mã trên chúng ta tạo biểu mẫu với thuộc tính action="save.php". Thuộc tính này dùng để xác định địa chỉ file PHP được dùng để xử lý biểu mẫu gửi trên máy chủ, ở đây là save.php (chúng ta sẽ tạo file này ở các phần tiếp theo). Ngoài ra, các trường nhập dữ liệu của biểu mẫu (thẻ input của HTML) được đăt giá trị tương ứng với thông tin trả về từ việc truy vấn CSDL.

Khi truy cập lại vào địa chỉ trang edit.php với mã số sinh viên tương ứng trong query string bạn sẽ thấy kết quả giống như trang mockup:

Truy Vấn CSDL Sử Dụng Query Parameter