Ngu ngơ học làm web (80) - Bài tập xử lý tập tin 3

Tiếp theo của: Ngu ngơ học làm web (79) - Bài tập xử lý tập tin 2
-----

Phần 80.       Bài tập xử lý tập tin 3


Đây là clip số 86:


Bài tập 1. Khi danh sách tập tin rỗng trang web sẽ hiển thị thông báo và ẩn nút “Xóa tập tin”

[index.php]

Kiểm tra danh sách tập tin đọc được, nếu không có tập tin nào, gán biến $noFile = true.

  require_once 'functions.php';
  $data = scandir('./files');
  $noFile = false;
  if (count($data) - 2 <= 0)
  {
    $noFile = true;
  }
?>

Nếu biến $noFile mang giá trị true thì xuất câu thông báo:

    <div class="heading">QUẢN LÝ TẬP TIN</div>
    <?php
      if ($noFile) {
        echo '<p>Chưa có tập tin.</p>';
      }
    ?>

Bài tập 2. Thay đổi thông báo cho hai trường hợp: thêm tập tin mới và sửa tập tin.

Sửa lại dòng thông báo trong [edit.php]:

<?php
          if ($flag == true) {
            echo '<div class="row">Cập nhật dữ liệu thành công!</div>';
          }
        ?>

Bài tập 3. Thông báo khi web client gửi ID của một tập tin mà nó không tồn tại trên server:

Cách làm: kiểm tra việc đọc nội dung tập tin, nếu kết quả trả về là false nghĩa là tập tin đó không tồn tại, thêm dấu @ trước hàm đọc tập tin để không xuất hiện cảnh báo trong trường hợp không đọc được tập tin.

[edit.php]

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <link rel="stylesheet" href="style.css">
  <script src="js/jquery.js"></script>
  <script>
    $(document).ready(function() {
      $('#btnHuy').click(function() {
        window.location = 'index.php';
      });
    });
  </script>
</head>
<body>
<?php
  require_once 'functions.php';
  $noExist = false;
  $id = $_GET['id'];
  $content = @file_get_contents('./files/' . $id . '.txt');
  if ($content == false) {
    $noExist = true;
  } else {
    $content = explode('||', $content);
    $title = $content[0];
    $description = $content[1];
    $flag = false;
    $errorTitle = '';
    $errorDescription = '';
    if (isset($_POST['title']) && isset($_POST['description'])) {
      $title = $_POST['title'];
      $description = $_POST['description'];
    // kiểm tra dữ liệu nhập vào
      if (checkEmpty($title)) {
        $errorTitle = '<p class="error">Tiêu đề không được để trống</p>';
      }
      if (checkLength($title, 5, 100)) {
        $errorTitle .= '<p class="error">Tiêu đề dài từ 5 đến 100 kí tự</p>';
      }
      if (checkEmpty($description)) {
        $errorDescription = '<p class="error">Mô tả không được để trống</p>';
      }
      if (checkLength($description, 10, 500)) {
        $errorDescription .= '<p class="error">Mô tả dài từ 10 đến 500 kí tự</p>';
      }
    // nếu dữ liệu hợp lệ
      if ($errorTitle == '' && $errorDescription == '') {
        $data = $title . '||' . $description;
        $fileName = './files/' . $id . '.txt';
        if (file_put_contents($fileName, $data)) {
          $title = '';
          $description = '';
          $flag = true;
        }
      }
    } 
  }
?>
<?php
  if ($noExist) {
    echo '<p>Tập tin không tồn tại </p>';
  } else {
?>
  <div class="wrapper">
    <div class="heading">EDIT FILE</div>
    <div id="form">
      <form action="#" method="post">
        <div class="row">
          <p class="title">Tiêu đề</p>
          <input type="text" name="title" value="<?php echo $title; ?>">
          <?php echo $errorTitle; ?>
        </div>
        <div class="row">
          <p class="title">Mô tả</p>
          <textarea name="description" rows="5" cols="100"><?php echo $description; ?></textarea>
          <?php echo $errorDescription; ?>
        </div>
        <div class="row">
          <input type="submit" value="Lưu">
          <input type="button" value="Hủy" id="btnHuy">
        </div>
        <?php
          if ($flag == true) {
            echo '<div class="row">Cập nhật dữ liệu thành công!</div>';
          }
        ?>
      </form>
    </div>
  </div>
<?php
}
?>
</body>
</html>

Tương tự cho [delete.php]

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <link rel="stylesheet" href="style.css">
  <script src="js/jquery.js"></script>
  <script>
    $(document).ready(function() {
      $('#btnHuy').click(function() {
        window.location = 'index.php';
      });
    });
  </script>
</head>
<body>
<?php
  require_once 'functions.php';
  $noExist = false;
  $id = $_GET['id'];
  $content = @file_get_contents('./files/' . $id . '.txt');
  if ($content == false) {
    $noExist = true;
  } else {
    $content = explode('||', $content);
    $title = $content[0];
    $description = $content[1];
    $flag = false;
    if (isset($_POST['id'])) {
      $id = $_POST['id'];
      @unlink('./files/' . $id . '.txt');
      $flag = true;
    }
  }
?>
<?php
  if ($noExist) {
    echo '<p>Tập tin không tồn tại </p>';
  } else {
?>
  <div class="wrapper">
    <div class="heading">DELETE FILE</div>
    <?php if ($flag == false) { ?>
    <div id="form">
      <form action="#" method="post">
        <div class="row">
          <p>Tập tin:</p>
          <span><?php echo realpath('./files/' . $id . '.txt'); ?></span>
        </div>
        <div class="row">
          <p>Tiêu đề:</p>
          <span><?php echo $title; ?></span>
        </div>
        <div class="row">
          <p>Mô tả:</p>
          <span><?php echo $description; ?></span>
        </div>
        <div class="row">
          <input type="hidden" name="id" value="<?php echo $id; ?>">
          <input type="submit" value="Xóa">
          <input type="button" value="Hủy" id="btnHuy">
        </div>
      </form>
      <?php }else {
        echo '<p>Đã xóa được tập tin. Bấm vào <a href="index.php">đây</a> để về trang chủ. </p>';
      } ?>
    </div>
  </div>
<?php
  }
?>
</body>
</html>

Bài tập 4. Khi xóa nhiều tập tin, trang web sẽ hiển thị một cửa sổ xác nhận “có chắc chắn xóa không?”, nếu người dùng bấm “đồng ý” thì xóa. Sử dụng jAlert của jQuery.

jAlert là một plug-in của jQuery, vào đây để tải jAlert về máy:


Khai báo trong [index.php]

<link rel="stylesheet" href="/jAlert/jAlert.css">
  <script src="js/jquery.js"></script>
  <script src="jAlert/jAlert.min.js"></script>
  <script>
    $(document).ready(function() {
      $('#multipleDelete').click(function() {
        $.jAlert({'type': 'confirm','confirmQuestion':'Các tập tin sẽ bị xóa vĩnh viễn, Bạn có chắc chắn muốn xóa không?', 'onConfirm': function(){
          $('#mainForm').submit();   
          }
        });
      });
    });

  </script>
-----------
Cập nhật [16/9/2020]
-----------
Xem thêm: