PHPだけ（DB不使用）でToDoリストを作りたい

PHPだけでToDoリストを作りたい

現在、データベースを使わずに、ToDoリストを作っているのですが、わからないところがあり、質問させていただきました。
[ToDoアプリ]

起きている問題

リストを追加することができたのですが、削除ボタンを押したとき、どこのボタンを押しても下から順番に削除されてしまいます。

このPHPの概要

・追加ボタンを押したとき、画面遷移せず、同じページにリロードされます。
・$FILEというファイルに
$BOARD[$DATA[$id, $date, $text], $DATA[], ...]
のように配列を追加していきます。（$BOARDは全体の配列，$DATAは一回分の投稿）
・リスト内容は、JSON形式（今回は配列型）で、todo.txtに保存されていきます。
・テスト用サイトはXSS対策などの部分を省略しています。

PHP
1<?php
2
3//保存ファイル名（PHPではファイル名は変数に保存する）
4//define('SAVE_NAME', 'memo.txt');
5$FILE = 'todo.txt';
6
7//ユニークなIDを生成（数字とアルファベット13文字）
8$id = uniqid('UNIQ_');
9
10//タイムゾーン設定
11date_default_timezone_set('Japan');
12//日時（年/月/日/ 時:分）
13$date = date('Y/m/d H:i');
14
15//テキスト
16$text = '';
17
18//一回分の投稿の情報
19$DATA = [];
20
21//全ての投稿
22$BOARD= [];
23
24if(file_exists($FILE)) {
25    //配列状態のファイルを読み込む
26    $BOARD = json_decode(file_get_contents($FILE));
27}
28
29if($_SERVER['REQUEST_METHOD'] === 'POST'){
30    //投稿ボタンが押された場合
31    if(!empty($_POST['txt'])){
32        
33        //$textにリクエストパラメーターを代入
34        $text = $_POST['txt'];
35        //新規データ
36        $DATA = [$id, $date, $text];
37        //新規データを全体配列に代入
38        $BOARD[] = $DATA;
39        //全体配列をファイルに保存
40        file_put_contents($FILE, json_encode($BOARD));
41        
42    //削除ボタンが押された場合
43    }else if(isset($_POST['del'])){
44        
45        $NewBOARD = [];
46        
47        foreach($BOARD as $DATA){
48            //$_POST['del']には各々のidが入っている
49            if($DATA[0] !== $_REQUEST['del']){
50                //リクエストから送信されてきたid以外を含む配列だけを新しく保存しなおす
51                $NewBOARD[] = $DATA;
52            }
53        }
54        file_put_contents($FILE, json_encode($NewBOARD));
55    }
56
57    //指定したページにリダイレクト
58    header('Location: '.$_SERVER['SCRIPT_NAME']);
59    exit;
60}
61?>
62
63<!DOCTYPE html>
64<html lang= "ja">
65<head>
66    <title>ToDoアプリ</title>
67    <link href= "css/todo.css" rel= "stylesheet">
68</head>
69<body>
70
71<h1>ToDoリスト</h1>
72    
73<form method= "post">
74    <input type= "text" name= "txt">
75    <input type= "submit" value= "投稿">
76</form>    
77
78<form method= "post">
79<table>
80<?php foreach((array)$BOARD as $DATA): ?>
81<tr>
82    <td class= "c1">
83        <?php echo $DATA[2]; ?>
84    </td>
85    <td class= "c2">
86        <?php echo $DATA[1]; ?>
87    </td>
88    <td class= "c3">
89        <input type= "hidden" name= "del" value= "<?php echo $DATA[0]; ?>">
90        <input type= "submit" value= "削除">
91    </td>
92</tr>
93<?php endforeach; ?>
94</table>
95</form>
96
97</body>
98</html>

試したこと

削除に関わるPHPの部分のforeachの引数や、代入する変数などを変更し試しました。

最後に

どうぞご教授宜しくお願い致します。不明な点等ございましたら、言っていただければと思います。

行動規範の内容に同意します

回答1件

ベストアンサー

複数のtodoデータになったときのフォーム構造がわかってないのかなと。
削除ボタンで送信する際のdelの値が、常にリストの最後の要素のidを送っているから、
最後のデータが削除される流れになっています。

ひとまず、

php
1<table>
2<?php foreach((array)$BOARD as $DATA): ?>
3<tr>
4<form method="POST">
5    <td class="c1">
6        <?php echo $DATA[2]; ?>
7    </td>
8    <td class="c2">
9        <?php echo $DATA[1]; ?>
10    </td>
11    <td class="c3">
12        <input type="hidden" name="del" value="<?php echo $DATA[0]; ?>">
13        <input type="submit" value="削除">
14    </td>
15</form>
16</tr>
17<?php endforeach; ?>
18</table>
19

とすることで回避できます。（行単位でフォーム生成）

ちなみに、勝手にアレンジしたんだが、
チェックボックスを使って一度に複数個削除できるようにしたバージョン：

php
1<?php
2
3//保存ファイル名（PHPではファイル名は変数に保存する）
4//define('SAVE_NAME', 'memo.txt');
5$FILE = '235077_todo.txt';
6
7//ユニークなIDを生成（数字とアルファベット13文字）
8$id = uniqid('UNIQ_');
9
10//タイムゾーン設定
11date_default_timezone_set('Japan');
12//日時（年/月/日/ 時:分）
13$date = date('Y/m/d H:i');
14
15//テキスト
16$text = '';
17
18//一回分の投稿の情報
19$DATA = [];
20
21//全ての投稿
22$BOARD= [];
23
24if (file_exists($FILE)) {
25    //配列状態のファイルを読み込む
26    $BOARD = json_decode(file_get_contents($FILE));
27}
28
29if ($_SERVER['REQUEST_METHOD'] === 'POST'){
30    //投稿ボタンが押された場合
31    if (!empty($_POST['txt'])) {
32
33        //$textにリクエストパラメーターを代入
34        $text = $_POST['txt'];
35        //新規データ
36        $DATA = [$id, $date, $text];
37        //新規データを全体配列に代入
38        $BOARD[] = $DATA;
39        //全体配列をファイルに保存
40        file_put_contents($FILE, json_encode($BOARD));
41
42    //削除ボタンが押された場合
43    } elseif (isset($_POST['del'])) {
44
45        $NewBOARD = [];
46
47        foreach((array)$BOARD as $DATA){
48            $flag = FALSE;
49            foreach ($_POST['del'] as $del) {
50                if ($DATA[0] === $del) {
51                    $flag = TRUE;
52                    break;
53                }
54            }
55            if ($flag === FALSE) {
56                $NewBOARD[] = $DATA;
57            }
58        }
59        file_put_contents($FILE, json_encode($NewBOARD));
60    }
61
62    //指定したページにリダイレクト
63    header('Location: '.$_SERVER['SCRIPT_NAME']);
64    exit;
65}
66?>
67<!DOCTYPE html>
68<html lang="ja">
69<head>
70    <title>ToDoアプリ</title>
71    <link href="css/todo.css" rel="stylesheet">
72</head>
73<body>
74
75<h1>ToDoリスト</h1>
76
77<form method="POST">
78    <input type="text" name="txt">
79    <input type="submit" value="投稿">
80</form>    
81
82<form method="POST">
83<table>
84<?php foreach((array)$BOARD as $DATA): ?>
85<tr>
86    <td class="c1">
87        <input type="checkbox" name="del[]" value="<?php echo $DATA[0]; ?>" />
88    </td>
89    <td class="c2">
90        <?php echo $DATA[2]; ?>
91    </td>
92    <td class="c3">
93        <?php echo $DATA[1]; ?>
94    </td>
95</tr>
96<?php endforeach; ?>
97<tr>
98    <td class="c3" colspan="3">
99        <input type="submit" value="削除">
100    </td>
101</tr>
102</table>
103</form>
104
105</body>
106</html>