如何创建一个表单，将添加一个包含多个输入字段的onclick按钮的排

如何创建一种形式，将在点击按钮添加一个包含多个输入字段的行（PHP + HTML）如何创建一个表单，将添加一个包含多个输入字段的onclick按钮的排

我的行包含1个选择选项和3个输入框。

<tr> 
    <td> 
     <select name="itemname[]" id="itemname" class="form-control" tabindex="1"> 
     ; 
     <option value="">Select item</option> 
     <?php 
      $sql_item = "SELECT id, item 
         FROM food_exchange_list 
         ORDER by item ASC"; 
      $result_item = mysqli_query($con, $sql_item); 
      if($result_item && $myrow_item = mysqli_fetch_array($result_item)) 
      { 
       do 
       { 
        $item_id = $myrow_item["id"]; 
        $item_name = $myrow_item["item"]; 
      ?> 
     <option value="<?php echo $item_id;?>"><?php echo $item_name; ?></option> 
     <?php 
      } 
      while($myrow_item = mysqli_fetch_array($result_item)); 
      } 
      ?> 
     </select> 
    </td> 
    <td><input type="number" class="form-control" min="0" max="100" id="exchange" name="exchange[]" required="required" tabindex="3" onchange="compute_protien(this.value)" style="width: 80px;"></td> 
    <td>60</td> 
    <td>2</td> 
    <td>60</td> 
    <td>2</td> 
</tr>

这是一行代码。我想在点击添加行按钮时添加类似的行，并且当有人从选择框中选择一个值并使用php在同一行中提供它时，我想从数据库中获取值。

来源

2017-09-26 M Sam

你想在运行时动态添加行吗？或者你知道有多少你需要，你只是想展示他们？ – SourceOverflow

我想在运行时动态添加行 –

（我假设jQuery是好根据您的标签）

您可以添加HTML元素使用追加一个jQuery的对象。例如，您可以使用$('<a>')为<a></a>标记创建html对象。

所以下面的代码：

var table = $('table#myTable'); // find the table you want to append to 
var newRow = $('<tr>'); // creates a new row 
newRow.append($('<td>')); // creates and appends an empty table data element 
table.append(newRow);  // appends the row to your table

不会增加更多的行到表的基础知识。当然，你也想加入你的类，名称，文字等

现在，让你的<select>所有选项 - 标记你有两种选择：

如果你有一个预定选项数量，你可以做离线
否则将请求发送到您的服务器

第一个解决方案显然是更快的。你可以简单地使用PHP将隐藏的数据添加到你的html中。通过在所需表格中添加一个data元素（例如），只需要最少的信息，复制一个现有的行（如果您始终至少有一行），或者您可以构建整行额外的行，但使用display: none; 。

注意：如果这在表单内，请确保它不会被发送或至少会被服务器忽略。最简单的方法就是在表单外添加这些元素。不过，我强烈建议在这种情况下使用data或“复制”选项。

如果你想获取数据生活添加新行时，你可以这样做，利用$.get()。然后让你的服务器回答所需的数据。

对于您的示例，您将发送所有项目的获取请求。这可能是这样的：

$.get("server_link_to_get_data.php", function(data, status) { 
    /* this is the callback; you should probably build your entire row here */ 
    $('select#whatever').append($('<option value="' + data + '">')); 
}

（显然是代码不会做的正是你想要的东西，因为你将要返回IDS和项目名称的数组，但工作原理几乎相同）

那么你当然也需要你的服务器用正确的数据来回答那个请求。这显然取决于你如何编程你的服务器。（我发现你没有使用MVC模型或类似的，我强烈推荐）

做这个请求可能是最干净的选项，因为它不会污染你的html，但是，你也会想请向用户明确说明您目前正在处理以避免发生愤怒点击。（网络连接，你可以发送请求之前禁用按钮，并在回调重新启用它）

摘要：如果你总是保证至少有一个排，我只想它的<option>部分复制，因为这使得一个干净的JS，并且不需要任何复杂的事情。你也只需要在PHP中构建你的html，如果你改变了某些东西，就不会更新你的JS。

但是，如果您没有这些，那么我可能只会发送一个GET请求并从那里构建行。

来源

2017-10-05 14:18:41 SourceOverflow

如何创建一个表单，将添加一个包含多个输入字段的onclick按钮的排

回答

相关问题