如何动态创建表单输入然后将其提交给php
我有一个页面,用户可以按下一个按钮,将两个新的表单输入附加到该页面。用户可以根据需要多次执行此操作。我遇到的问题是我似乎无法访问我提交的 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]);
}
我感谢您提供的任何帮助!
I have a page where the user can press a button that will append two new form inputs to the page. The user can do this as many times as necessary. The problem I am having is that I cannot seem to access the new inputs in the php file I am submitting to.
Here is the code for the button on the page the user sees. It is within a form.
<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>
Here is the javascript function 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;
}
Here is the code on the page being submitted to that tries to retrieve the posted values.
$projectCount = strip_tags($_POST["projectCount"]);
for($i = 0; $i < $projectCount; $i += 1)
{
$checkpointNames[] = strip_tags($_POST["checkpointName".$i]);
$checkpointDescriptions[] = strip_tags($_POST["checkpointDescription".$i]);
}
I appreciate any help that can be offered!
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
好吧,我明白了,这是一个菜鸟错误。我的输入甚至没有附加到我的表格中。不过还是谢谢你的帮助!我很感谢您花时间查看我的代码。
Ok, I figured it out, it was a rookie mistake. My inputs weren't even being appended to my form. Thanks for the help though! I appreciate the time you gave to look over my code.
尝试将元素放入 a 中,并确保使用提交按钮或来自 javasrtipt 的 form.submit 提交表单
Try to put the elements into a and make sure you submit the form with a submit button or with form.submit from javasrtipt