如何动态创建表单输入，然后将它们提交给 php答案

【问题标题】：How to dynamically create form inputs and then submit them to php如何动态创建表单输入，然后将它们提交给 php
【发布时间】：2011-10-23 02:50:49
【问题描述】：

我有一个页面，用户可以在其中按下一个按钮，将两个新的表单输入附加到页面。用户可以根据需要多次执行此操作。我遇到的问题是我似乎无法访问我提交的 php 文件中的新输入。

这是用户看到的页面上按钮的代码。它在一个表格内。

<div class='instruction'> 
    <p>Please use the checkpoint tool to outline the primary steps 
       necessary for completion of the project.
       <h4 style='margin-bottom:5px;'>Checkpoint Tool</h4>
       <input type='button' onclick='addCheckpoint()' value='Add Checkpoint' />
       <input type='text' id='count' name='projectCount' style='width:25px;' readonly='true' />
    </p>
    <div id='checkpoints'> 
    </div> 
</div>

这里是 javascript 函数 addCheckpoint()

function addCheckpoint()
{     

  var count = +document.getElementById('count').value; 

  //  Declare Variables

  var checkpointText = "Checkpoint "+(count+1); 
  var nameText = "Checkpoint Name: "; 
  var instructionText = "Instructions: ";

  var previous = document.getElementById("checkpoints");

  var newP = document.createElement("p");

  var nameInput = document.createElement("input");
      nameInput.setAttribute("type","text"); 
      nameInput.setAttribute("name","checkpointName" + count);



  var instructionInput = document.createElement("textarea");
      instructionInput.setAttribute("name","checkpointInstruction" + count);
      instructionInput.setAttribute("rows","4");
      instructionInput.setAttribute("cols","56");

  //  Append Variables 

      newP.appendChild(document.createTextNode(checkpointText));
      newP.appendChild(document.createElement("br"));
      newP.appendChild(document.createElement("br"));
      newP.appendChild(document.createTextNode(nameText));
      newP.appendChild(nameInput);
      newP.appendChild(document.createElement("br"));
      newP.appendChild(document.createTextNode(instructionText));
      newP.appendChild(instructionInput);
      newP.appendChild(document.createElement("br"));
      newP.appendChild(document.createElement("hr"));

      previous.appendChild(newP);


      document.getElementById('count').value = count + 1; 
}

这是正在提交的页面上尝试检索发布值的代码。

$projectCount = strip_tags($_POST["projectCount"]); 
     for($i = 0; $i < $projectCount; $i += 1)
    {   
       $checkpointNames[] = strip_tags($_POST["checkpointName".$i]);
       $checkpointDescriptions[] = strip_tags($_POST["checkpointDescription".$i]);           
    }

感谢您提供的任何帮助！

【问题讨论】：

如果你在 PHP 中添加一些调试，比如将 $_POST 转储到屏幕上......它看起来如何？
我在 $_POST 上使用了 var_dump，它打印出了我表单中的所有输入，除了动态创建的输入。同样，当我尝试使用 GET 而不是 POST 时，创建的输入不会提交到 URL。

标签： php javascript post input dynamic

【解决方案1】：

好的，我想通了，这是一个菜鸟的错误。我的输入甚至没有附加到我的表单中。不过感谢您的帮助！感谢您花时间查看我的代码。

【讨论】：

你应该添加答案，而不是这个评论。
我做到了。我的代码有效，但问题是生成的输入没有附加到表单中。这就是为什么当我提交表单时它们没有被包含在内。

【解决方案2】：

尝试将元素放入 a 并确保使用提交按钮或 javasrtipt 中的 form.submit 提交表单

【讨论】：