在表单上添加另一个项目/行，插入到DB中

Question

这两个字段将插入到数据库中。但是，我想让用户能够“添加另一个项目”。理想情况下，他们应该可以添加任意数量的项目。当他们提交表单时，数据将被插入到mysql表中。

我该怎么做呢？在我的数据库中创建10个额外的列以容纳额外的项目，这听起来不太现实也不理想。

感谢您的帮助！

以下是我的代码片段，我将数据插入到数据库中：

if ($stmt = $mysqli->prepare("INSERT items (number, description) VALUES (?, ?)"))
                            {
                                    $stmt->bind_param("ss", $number, $description);
                                    $stmt->execute();
                                    $stmt->close();
                            }

Answer 1

这是一个非常复杂的问题，但有一些非常简单的解决方案。首先，您需要更改用于处理可变数量项目的后端PHP脚本。

例如，现在，你可能有类似的东西：

$item_number = $_POST['item_number'];
$item_description = $_POST['item_description'];
add_item_to_db($item_number, $item_description);

您需要更改代码以处理项目数组的处理：

$item_numbers = $_POST['item_number'];
$item_descriptions = $_POST['item_description'];
// validate that count($item_numbers) == count($item_descriptions)
for ($i = 0; $i < count($item_numbers); $i++) {
    add_item_to_db($item_numbers[$i], $item_descriptions[$i]);
}

您需要在上面执行相当多的错误处理，而不是显示。如果用户输入的item_numbers数量不同于item_descriptions，则必须确定如何处理。此外，任何字段都可以为空白。有些情况可能是错误，有些情况可能不是。

您必须更改HTML：

<input type="text" name="item_number[]" />
<input type="text" name="item_description[]" />

请注意名称中的 [] 。这为每个值指定了一个值数组。

最后，当用户按下添加其他项链接时，您需要在屏幕上动态添加一组新的输入项。我建议使用jQuery。要做到这一点，你会做类似的事情：

jQuery('<input type="text" name="item_number[]" /><input type="text" name="item_description[]" />').appendTo('#someDiv');

确保新的输入元素附加在表单元素中。显然，还有很多代码需要编写。这只是概念的一个基本例子。

Answer 2

只需使用：

name="item[]"

项目＃'

和

name="description[]"

<input type="text" name="item[]" /><input type="text" name="description[]" />

对于项目描述字段，在服务器端迭代它们。 在前端只需创建一个多次复制该节点的脚本。

修改

根据您展示的代码，它应该类似于以下代码：

if(isset($_POST['item']){
for($i = 0; $i < count($_POST['item']); $i++){
$number = $_POST['item'][$i];
$description= $_POST['description'][$i];
if ($stmt = $mysqli->prepare("INSERT items (number, description) VALUES (?, ?)"))
                            {
                                    $stmt->bind_param("ss", $number, $description);
                                    $stmt->execute();
                                    $stmt->close();
                            }
}

在你的javascript中，如下所示：

function addRow(){
  document.getELementById('container').el.innerHTML += '<input type="text" name="item[]" /><input type="text" name="description[]" />' ;
}

HTML代码：

<form name='myform' >

 <div id="container">
 <input type="text" name="item[]" /><input type="text" name="description[]" />     
 </div>
    <p onclick="addRow() ;" >Add another item</p>
</form>

我希望这会有所帮助。

<强>更新

试试这个：

if(isset($_POST['item']){

if ($stmt = $mysqli->prepare("INSERT items (number, description) VALUES (?, ?)"))
{
  for($i = 0; $i < count($_POST['item']); $i++){
  $number = $_POST['item'][$i];
  $description= $_POST['description'][$i];

                                    $stmt->bind_param("ss", $number, $description);
                                    $stmt->execute();

  }
  $stmt->close();

 }