如何通过html、json和php中的输入帖子添加到列表中？（不使用数据库）？

我已经为此挣扎了一段时间。我认为我的逻辑中缺少了一部分，我无法理解它是什么。我正在尝试使用Html、json和php制作一个todo应用程序。如何将输入值存储为数组，然后作为待办事项列表进行回显

<form method="POST" action="TodoAppChallenge.php">
    <p>
        <label for="wordsGoHere">type your task here</label>
        <input type="text"  id ="wordsGoHere" name="wordsGoHere">
    </p>
    <input type="submit" name="pressHere" value="           add Your Task               ">
</form>
<?php
include('TodoAppChallengeExtra.php');
?>

<table>
      <thead>
      <th>Your Tasks</th>
      </thead>
      <tbody>
<?php
    if(isset($_POST['pressHere'])){
                  
            $wordsGoHere = array(
            'wordsGoHere' => $_POST['wordsGoHere'],
      );    //i think my mistake is somewhere around here
            array_push($wordsGoHere,$_POST['wordsGoHere']);
            $data = $wordsGoHere;
            $data = json_encode($data, JSON_PRETTY_PRINT);
            file_put_contents('extra.json', $data);
            $data = file_get_contents('extra.json');
            $data = json_decode($data);
            foreach($data as $row){
            echo "
                  <tr>
                        <td>
                        <ul><li>".$row->$data."</li></ul>
                        </td>
                  </tr>
            ";
    }} else {
      echo 'add a Task';
     }
      ?>
       </tbody>
 </table>

在此处键入任务

你的任务

我已经试着简化这个过程，您有很多不需要的变量重新赋值。基本上

  if(isset($_POST['pressHere'])){
   // get the tasks, note the 'true' flag on the json decode so you have an array rather than an object

    $tasks = json_decode(file_get_contents('extra.json'), true);
    
    //keep things simple - use the same array and just add the new value to it

    $tasks[] = $_POST['wordsGoHere'];

    //print out your values
    foreach($tasks as $task){
        echo "
              <tr>
                    <td>
                    <ul><li>" . $task . "</li></ul>
                    </td>
              </tr>
        ";
    }

    //using the same array prepare to save it
    $tasks = json_encode($tasks, JSON_PRETTY_PRINT);

    //save the data
    file_put_contents('extra.json', $tasks);


} else {
    echo 'add a Task';

}

---

代码已注释，但以下是要点：

• 将表单处理向上移动，以避免出现“标题已发送…”错误
• 打开错误报告
• 使用合理、简单的语言变量名
• 让阵列尽可能简单

您还可以做哪些改进？使用常量定义诸如会话密钥

todo

、验证、将其拆分为处理文件和演示文件等内容

如果您想更高级一点，请设计一种存储机制，使表单和表单处理逻辑不知道或不关心数据是否存储在JSON文件、会话、数据库或其他文件中。它看起来像：

$storage->save（$userInput）

和

$storage->retrieve（）

祝你好运

通过会话实现

<?php

ini_set('display_errors', '1');
ini_set('display_startup_errors', '1');
error_reporting(E_ALL);

// Always do these 2 things on every request.

// 1. Start your session
session_start();

// 2. Initialize the session array if it hasn't been initialized already.
// This only happens once per session.
if (!isset($_SESSION['todo'])) {
    $_SESSION['todo'] = [];
}

// Now you are free to start writing and reading from your session.

// Check if the request is coming in via POST.
// Do your processing up top above your HTML otherwise you can run into "Headers already sent..." errors.
if ($_SERVER['REQUEST_METHOD'] === 'POST') {

    // This is what the user typed in.
    $input = $_POST['wordsGoHere'];

    // @todo do your validation here.

    // Put the user's input in the session.
    $_SESSION['todo'][] = $input;
}

// Finally, read out the contents from your session so your form has access to it.
$dataFromSession = $_SESSION['todo'];
?>

<form method="POST">
    <p>
        <label for="wordsGoHere">type your task here</label>
        <input type="text" id="wordsGoHere" name="wordsGoHere">
    </p>

    <input type="submit" name="submit" value="Add Your Task">
</form>
<table>
    <thead>
    <tr>
        <th>
            Your Tasks
        </th>
    </tr>
    </thead>

    <tbody>
    <?php foreach ($dataFromSession as $item): ?>

        <tr>
            <td>
                <?= $item; ?>
            </td>
        </tr>

    <? endforeach; ?>
    </tbody>
</table>



在此处键入任务

你的任务

通过JSON文件实现

<?php

ini_set('display_errors', '1');
ini_set('display_startup_errors', '1');
error_reporting(E_ALL);

// Initialize your JSON file by ensuring the file actually exists. If it doesn't, create an empty file.
if (!file_exists('extra.json')) {
    file_put_contents('extra.json', '[]');
}

// Now you are free to start writing and reading from your JSON file.

// Check if the request is coming in via POST.
// Do your processing up top above your HTML otherwise you can run into "Headers already sent..." errors.
if ($_SERVER['REQUEST_METHOD'] === 'POST') {

    // This is what the user typed in.
    $input = $_POST['wordsGoHere'];

    // @todo do your validation here.

    // Read the current state of the file.
    $contents = file_get_contents('extra.json');
    $dataFromFile = json_decode($contents, true);

    // Push the new value on the end of the array.
    $dataFromFile[] = $input;

    // Write the array back to the file.
    $json = json_encode($dataFromFile, JSON_PRETTY_PRINT);
    file_put_contents('extra.json', $json);
}

// Finally, read out the latest contents from your file so your form has access to it.
$contents = file_get_contents('extra.json');
$dataFromFile = json_decode($contents, true);
?>

<form method="POST">
    <p>
        <label for="wordsGoHere">type your task here</label>
        <input type="text" id="wordsGoHere" name="wordsGoHere">
    </p>

    <input type="submit" name="submit" value="Add Your Task">
</form>
<table>
    <thead>
    <tr>
        <th>
            Your Tasks
        </th>
    </tr>
    </thead>

    <tbody>
    <?php foreach ($dataFromFile as $item): ?>

        <tr>
            <td>
                <?= $item; ?>
            </td>
        </tr>

    <? endforeach; ?>
    </tbody>
</table>

有什么问题？您无法存储值或无法显示ithanks以获得帮助，我尝试了这两种方法，我的代码教练说，这两种方法都是很好的替代方法，符合我的方向。谢谢：）汉克斯的帮助，我尝试了这两种方法，我的代码教练说这两种方法都是很好的替代方法。谢谢：）@devvt没问题。如果答案对你有帮助，别忘了投票并将其中一个标记为已接受。
<?php

ini_set('display_errors', '1');
ini_set('display_startup_errors', '1');
error_reporting(E_ALL);

// Initialize your JSON file by ensuring the file actually exists. If it doesn't, create an empty file.
if (!file_exists('extra.json')) {
    file_put_contents('extra.json', '[]');
}

// Now you are free to start writing and reading from your JSON file.

// Check if the request is coming in via POST.
// Do your processing up top above your HTML otherwise you can run into "Headers already sent..." errors.
if ($_SERVER['REQUEST_METHOD'] === 'POST') {

    // This is what the user typed in.
    $input = $_POST['wordsGoHere'];

    // @todo do your validation here.

    // Read the current state of the file.
    $contents = file_get_contents('extra.json');
    $dataFromFile = json_decode($contents, true);

    // Push the new value on the end of the array.
    $dataFromFile[] = $input;

    // Write the array back to the file.
    $json = json_encode($dataFromFile, JSON_PRETTY_PRINT);
    file_put_contents('extra.json', $json);
}

// Finally, read out the latest contents from your file so your form has access to it.
$contents = file_get_contents('extra.json');
$dataFromFile = json_decode($contents, true);
?>

<form method="POST">
    <p>
        <label for="wordsGoHere">type your task here</label>
        <input type="text" id="wordsGoHere" name="wordsGoHere">
    </p>

    <input type="submit" name="submit" value="Add Your Task">
</form>
<table>
    <thead>
    <tr>
        <th>
            Your Tasks
        </th>
    </tr>
    </thead>

    <tbody>
    <?php foreach ($dataFromFile as $item): ?>

        <tr>
            <td>
                <?= $item; ?>
            </td>
        </tr>

    <? endforeach; ?>
    </tbody>
</table>