Question

<script type="text/javascript">
var i = 1;
function generateRow() {
var d=document.getElementById("div");
d.innerHTML+="<p><input type='text' name='[Post][textbox1][" + i + "]'>";
i = i + 1;
}

<?php $this->Form->input('textbox1',array(
                'type' => 'textbox',
                'label' => false,
                'required')); ?>
              <div id="div"></div>

    <input type="button" value="Add" onclick="generateRow()"/>

Html For Textbox1

<div class="input textbox"><input name="data[Post][textbox1]"
 required="required"type="textbox" id="PostTextbox1"/></div>

当我点击“添加”按钮时，它会生成包含name="[Post][textbox1][1]"的新文本框我可以在该框中输入数据，但

第1期

当我再次点击“添加”按钮时，它将重置所有文本框，我必须再次输入这些数据

第2期

$tbVal = $this->request->data['Post']['textbox1'];
$inn = implode(',',$tbVal);

当我使用此代码从文本框中删除数据时，它只显示第一个数据

Answer 1

您已重置div document.getElementById("div")中的所有数据，因为它会重置文本框中的所有数据。

尝试：

//Create an input type dynamically.
var element = document.createElement("input");
//Assign different attributes to the element.
element.setAttribute("type", type);
element.setAttribute("value", type);
element.setAttribute("name", type);
var foo = document.getElementById("fooBar");
//Append the element in page (in span).
foo.appendChild(element);

点击按钮

Answer 2

这是一个基于第一个答案和我的答案的工作示例：

<script type="text/javascript">
var i = 1;
function generateRow() 
{

    //Create an input type dynamically.
    var element = document.createElement("input");
    //Assign different attributes to the element.
    element.setAttribute("type", "text");
    element.setAttribute("value", "");
    element.setAttribute("name", "data[Post][textbox][" + i + "]");
    var foo = document.getElementById("fooBar");
    //Append the element in page (in span).
    foo.appendChild(element);

    i = i + 1;

}
</script>

<form>

<div id="fooBar" class="input textbox">
    <input name="data[Post][textbox][0]" required="required" type="textbox" id="PostTextbox1"/>
</div>

<input type="button" value="Add" onclick="generateRow()"/>
<input type="submit" >
</form>

<?php
print_r($_REQUEST);
?>

您必须使用DOM操作javascript函数来重置文本值并使用文本框的正确名称

Answer 3

关于问题2

此代码：

d.innerHTML+="<p><input type='text' name='[Post][textbox1][" + i + "]'>";

必须是

d.innerHTML+="<p><input type='text' name='data[Post][textbox1][" + i + "]'>";

在一个数据库字段中插入多个文本框的数据

3 个答案: