さて、それでは記事を編集、削除できるようにしましょう。
そのために、main.php
で編集、削除へのリンクを作成しておく必要があります。
メインページの改修
さて、まずはメインページを改修します。
とはいっても、リンクを2つ増やすだけです。
main.php
に下記の、左に+
マークがついた行を追記しましょう。
(+
マークは実際にソースコード中に書かないでください。)
<table> <tr> <td>記事ID</td> <td>タイトル</td> <td>本文</td> <td>投稿日</td> + <td></td> + <td></td> </tr> <?php while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) { ?> <tr> <td><?php echo $row['id']; ?></td> <td><?php echo $row['title']; ?></td> <td><?php echo $row['content']; ?></td> <td><?php echo $row['time']; ?></td> + <td><a href="edit_post.php?id=<?php echo $row['id']; ?>">編集</a></td> + <td><a href="delete_post.php?id=<?php echo $row['id']; ?>">削除</a></td> </tr> <?php } ?> </table>
さて、下記2つはedit_post.php
とdelete_post.php
へのリンクになります。
<td><a href="edit_post.php?id=<?php echo $row['id']; ?>">編集</a></td> <td><a href="delete_post.php?id=<?php echo $row['id']; ?>">削除</a></td>
ただ、何か余計なものがついています。
?
以降は、次のページに渡したいデータになります。
もう少し正確に言えば、GETでid
という名前がついた値を渡しています。
上記のような書き方だと分かりづらいですが、下記ではどうでしょう?
<a href="edit_post.php?id=1; ?>">編集</a>
id = 1
をedit_post.php
に渡しています。
このid
を渡すことで、edit_post.php
ではそのid
の記事を表示させることができます。
(もちろん、その処理を書きます。)
渡すid
を動的にするために、PHPにて埋め込んでいます。
<td><a href="edit_post.php?id=<?php echo $row['id']; ?>">編集</a></td>
削除も同じですね。
下記の場合は、削除を担当するdelete_post.php
にid = 1
を渡すことで、対象IDの削除処理を実施します。
<a href="delete_post.php?id=1">削除</a>
id
部分を動的にするために、下記のようにPHPを埋め込んでいます。
<a href="delete_post.php?id=<?php echo $row['id']; ?>">削除</a>
編集画面、編集完了画面
今回、編集画面は少し複雑なので、サンプルソースを先に写してもらい、それをもとに解説をしたいと思います。
編集画面と、実際に編集処理を行うファイルは分けたいとおもいます。
サンプル
記事編集画面
記事編集完了画面
記事編集画面
さて、まずは編集画面です。
サンプルソースを写してもらうと、下図のような画面かと思います。
記事を編集するためには、 まず編集したい記事の情報を取得する 必要があります。
先ほど、「編集」へのリンクを作成した際に、?id=<?php echo $row['id']; ?>
でこのedit_post.php
にid
を渡しています。
まずはそれを受け取りましょう。
// URLの?以降で渡されるIDをキャッチ $id = $_GET['id'];
この受け取ったid
が編集したい記事のものなので、この$id
を使用してposts
テーブルを検索します。
ただし、もし$id
がempty
(空)だったら、検索しても意味ないのでmain.php
にリダイレクトさせます。
// もし、$idが空であったらmain.phpにリダイレクト // 不正なアクセス対策 if (empty($id)) { header("Location: main.php"); exit; }
これ以降の処理は今までやったものと近いので、割愛します。
最後に、DBから取得した各値を変数に格納しておきます。
// 結果が1行取得できたら if ($row = $stmt->fetch(PDO::FETCH_ASSOC)) { $id = $row['id']; $title = $row['title']; $content = $row['content']; } else { // 対象のidでレコードがない => 不正な画面遷移 echo "対象のデータがありません。"; }
さあ、これで準備はできました。
編集画面というと、編集する前のデータが表示されている必要があります。
inputタグ
のvalue
属性に値を入れておくと、あらかじめテキストボックスの中に入れておく値を設定できます。
(これはHTMLの文法です。)
そこに埋め込みPHPで、先ほどの変数を設定してあげます。
<input type="hidden" name="id" value="<?php echo $id; ?>" > title:<br> <input type="text" name="title" id="title" style="width:200px;height:50px;" value=<?php echo $title; ?>><br> content:<br> <input type="text" name="content" id="content" style="width:200px;height:100px;" value=<?php echo $content; ?>><br>
formタグ
で囲っているので、ここで編集した値をedit_done_post.php
に渡します。
hidden
属性でid
も渡していることに留意しておいてください。
編集完了画面、処理
編集完了画面を見る前に、実際に編集してみましょう。
うまくいったのであれば、下図のようにページが表示されるはずです。
DBも確認してみましょう。
書き換わっていることが分かります。
(今回はid=3
に追記しました。)
さて、実はedit_done_post.php
でやっている処理の流れは今までやってきたことと大差ありません。
ただ、上記の編集画面の処理と一緒にしてしまうと、ごちゃごちゃしてしまうので分けています。
今回は、編集画面からPOSTで送られたid
、title
、content
を受け取り、その値をもとにDBをUPDATE
します。
$id = $_POST["id"]; $title = $_POST["title"]; $content = $_POST["content"];
あるidの値を書き換えたい場合は下記のようなUPDATE文 でしたね。
MySQL
このUPDATE
文をPDOで実行しているだけです。
削除処理
削除にかんしては、ただDBからレコードを消すだけなので、専用のページは作りません。
以下の処理で考えます。
- メインページで削除ボタンを押す。
delete_post.php
に移動する。- 対象の記事を削除する。
- 削除が完了したら
main.php
にリダイレクトする。
さて、この処理は今までの知識の範囲内です。
ヒントのサンプルコードは下記に示しますので、頑張って埋めましょう。
posts
テーブルのid = 1
のレコードを削除する場合は、下記のようになります。
DELETE FROM posts WHERE id = 1;
実際に削除できていれば、DBからレコードが消えています。