ایجاد دکمه‌ی ویرایش (Edit)

Creating Edit Button

25 بهمن 1399
پروژه ساخت شبکه ی اجتماعی: ایجاد دکمه ی ویرایش (edit)

در قسمت قبل دکمه های edit و delete را ایجاد کردیم اما هنوز کارایی شان را کدنویسی نکرده ایم. برای شروع کار به فایل Posts.php می رویم و تابع جدیدی به نام edit می سازیم. این تابع شبیه تابع add خواهد بود بنابراین محتویات تابع add را برای آن کپی میکنیم و سپس بعضی چیزها را دستی تغییر دهیم. کدهای تابع add بدین شکل است:

public function add(){
      if($_SERVER['REQUEST_METHOD'] == 'POST'){
        // Sanitize POST array
        $_POST = filter_input_array(INPUT_POST, FILTER_SANITIZE_STRING);

        $data = [
          'title' => trim($_POST['title']),
          'body' => trim($_POST['body']),
          'user_id' => $_SESSION['user_id'],
          'title_err' => '',
          'body_err' => ''
        ];

        // Validate data
        if(empty($data['title'])){
          $data['title_err'] = 'Please enter title';
        }
        if(empty($data['body'])){
          $data['body_err'] = 'Please enter body text';
        }

        // Make sure no errors
        if(empty($data['title_err']) && empty($data['body_err'])){
          // Validated
          if($this->postModel->addPost($data)){
            flash('post_message', 'Post Added');
            redirect('posts');
          } else {
            die('Something went wrong');
          }
        } else {
          // Load view with errors
          $this->view('posts/add', $data);
        }

      } else {
        $data = [
          'title' => '',
          'body' => ''
        ];
  
        $this->view('posts/add', $data);
      }
    }

ابتدا به قسمت بارگذاری view می رویم و view مربوط به edit را بارگذاری می کنیم:

$this->view('posts/edit', $data);

الان به مشکلی برخورده ایم. دکمه edit برای کاربرانی که صاحب یک پست نباشند، نشان داده نمی شود اما هنوز هم می توانند آدرس را در مرورگر خود به صورت دستی وارد کنند و پست را ویرایش کنند بنابراین باید جلوی این راه را هم بگیریم. برای همین می گوییم:

} else {
          // Load view with errors
          $this->view('posts/edit', $data);
        }

      } else {
        // Get existing post from model
        $post = $this->postModel->getPostById($id);

        // Check for owner
        if($post->user_id != $_SESSION['user_id']){
          redirect('posts');
        }

        $data = [
          'title' => '',
          'body' => ''
        ];
  
        $this->view('posts/edit', $data);
      }

قسمتی از بالای کد را هم قرار داده ام تا بدانید کدام قسمت را باید ویرایش کنیم. در ابتدای کار پست مورد نظر برای ویرایش را دریافت و در متغیری به نام post$ قرار داده ایم. سپس گفته ایم اگر user_id با session مربوطه برابر نبود (یعنی فرد صاحب پست نبود) redirect شود.

حالا باید مشخصات پست حال حاضر را به data بدهیم بنابراین کد مربوط به Data را اینطور ویرایش می کنیم:

$data = [
          'id' => $id,
          'title' => $post->title,
          'body' => $post->body
        ];

مقدار id که به خود تابع پاس داده شده است (به عنوان پارامتر). مقدار title و body را از همان پستی که از پایگاه داده گرفتیم، دریافت می کنیم. حالا باید view ای به نام edit ایجاد کنیم بنابراین به پوشه views > posts رفته و فایل جدیدی به نام edit.php بسازید. حالا کدهای HTML را برای این صفحه می نویسیم:

<?php require APPROOT . '/views/inc/header.php'; ?>
  <a href="<?php echo URLROOT; ?>/posts" class="btn btn-light"><i class="fa fa-backward"></i> Back</a>
  <div class="card card-body bg-light mt-5">
    <h2>Edit Post</h2>
    <p>Create a post with this form</p>
    <form action="<?php echo URLROOT; ?>/posts/edit/<?php echo $data['id']; ?>" method="post">
      <div class="form-group">
        <label for="title">Title: <sup>*</sup></label>
        <input type="text" name="title" class="form-control form-control-lg <?php echo (!empty($data['title_err'])) ? 'is-invalid' : ''; ?>" value="<?php echo $data['title']; ?>">
        <span class="invalid-feedback"><?php echo $data['title_err']; ?></span>
      </div>
      <div class="form-group">
        <label for="body">Body: <sup>*</sup></label>
        <textarea name="body" class="form-control form-control-lg <?php echo (!empty($data['body_err'])) ? 'is-invalid' : ''; ?>"><?php echo $data['body']; ?></textarea>
        <span class="invalid-feedback"><?php echo $data['body_err']; ?></span>
      </div>
      <input type="submit" class="btn btn-success" value="Submit">
    </form>
  </div>
<?php require APPROOT . '/views/inc/footer.php'; ?>

این کدها دقیقا مانند کدهای نوشتن پست جدید هستند. بنابراین می توانید آن را کپی کرده و مانند ما تغییر دهید. نکته مهم این است که action مربوط به این فرم را از posts/add به posts/edit تغییر دهید چرا که این فرم مخصوص ویرایش است نه ثبت نوشته جدید (به کد بالا توجه کنید).

حالا باید دوباره به تابع edit برگردیم که از add کپی کرده بودیم. از قسمتی که کامنت Make sure no errors را دارد وارد عمل می شویم. ما نمی خواهیم متد addPost را صدا بزنیم بلکه متدی به نام updatePost را جایگزین آن می کنیم. همچنین برای flash message می نویسیم Post Updated و در آخر در صورت بروز خطا دوباره صفحه edit را بارگذاری می کنیم نه صفحه add را:

// Make sure no errors
        if(empty($data['title_err']) && empty($data['body_err'])){
          // Validated
          if($this->postModel->updatePost($data)){
            flash('post_message', 'Post Updated');
            redirect('posts');
          } else {
            die('Something went wrong');
          }
        } else {
          // Load view with errors
          $this->view('posts/edit', $data);
        }

اکنون باید به پوشه model و فایل Post.php برویم و تابع updatePost را ایجاد کنیم:

public function updatePost($data){
      $this->db->query('UPDATE posts SET title = :title, body = :body WHERE id = :id');
      // Bind values
      $this->db->bind(':id', $data['id']);
      $this->db->bind(':title', $data['title']);
      $this->db->bind(':body', $data['body']);

      // Execute
      if($this->db->execute()){
        return true;
      } else {
        return false;
      }
    }

برای اینکه دستور edit کار کند یک مرحله دیگر مانده است. در فایل Posts.php که تابع edit را نوشته ایم مراجعه کنید. برای این تابع همان تابع add را کپی کردیم و مقادیری را تغییر دادیم اما هنوز یک مورد مانده است. در قسمت data این تابع مقدار id وجود ندارد بنابراین باید آن را نیز اضافه کنیم:

        $data = [
          'id' => $id,
          'title' => trim($_POST['title']),
          'body' => trim($_POST['body']),
          'user_id' => $_SESSION['user_id'],
          'title_err' => '',
          'body_err' => ''
        ];

بنابراین تابع کامل شده edit بدین صورت خواهد بود:

public function edit($id){
      if($_SERVER['REQUEST_METHOD'] == 'POST'){
        // Sanitize POST array
        $_POST = filter_input_array(INPUT_POST, FILTER_SANITIZE_STRING);

        $data = [
          'id' => $id,
          'title' => trim($_POST['title']),
          'body' => trim($_POST['body']),
          'user_id' => $_SESSION['user_id'],
          'title_err' => '',
          'body_err' => ''
        ];

        // Validate data
        if(empty($data['title'])){
          $data['title_err'] = 'Please enter title';
        }
        if(empty($data['body'])){
          $data['body_err'] = 'Please enter body text';
        }

        // Make sure no errors
        if(empty($data['title_err']) && empty($data['body_err'])){
          // Validated
          if($this->postModel->updatePost($data)){
            flash('post_message', 'Post Updated');
            redirect('posts');
          } else {
            die('Something went wrong');
          }
        } else {
          // Load view with errors
          $this->view('posts/edit', $data);
        }

      } else {
        // Get existing post from model
        $post = $this->postModel->getPostById($id);

        // Check for owner
        if($post->user_id != $_SESSION['user_id']){
          redirect('posts');
        }

        $data = [
          'id' => $id,
          'title' => $post->title,
          'body' => $post->body
        ];
  
        $this->view('posts/edit', $data);
      }
    }

دانلود فایل های پروژه تا این جلسه

در قسمت بعدی دکمه delete (حذف) را کدنویسی خواهیم کرد.

تمام فصل‌های سری ترتیبی که روکسو برای مطالعه‌ی دروس سری آموزش ساخت شبکه اجتماعی توصیه می‌کند:
نویسنده شوید
دیدگاه‌های شما

در این قسمت، به پرسش‌های تخصصی شما درباره‌ی محتوای مقاله پاسخ داده نمی‌شود. سوالات خود را اینجا بپرسید.