多选下拉与动态新增字段功能异常：仅首条数据存入数据库

Hey there! Let's sort out this issue—it's a classic gotcha with multi-value inputs and dynamic form fields. The core problem is how your form names are structured, which is causing your backend to only pick up the first set of values. Here's how to fix it step by step:

1. Fix the Multiple Select Name #

Right now, your multiple <select> probably has a plain name like serialNumber. When you select multiple options, the browser will only send the first one unless you tell it to pass an array. Update your select tag to use square brackets in the name:

<select name="serialNumber[]" multiple="multiple" id="DONO">
  <!-- Your option elements here -->
</select>

This tells PHP (or whatever backend you're using) to treat serialNumber as an array containing all selected values.

2. Update Dynamic Fields to Use Array Names #

Same rule applies to your dynamic part and quantity fields. If each new group uses the same plain name (like partName or quantity), only the first value gets captured. Instead, use array syntax for their names too:

Initial Field Group Example #

<div class="form-group part-container">
  <label>配件名称</label>
  <input type="text" name="partName[]" class="form-control" placeholder="输入配件名称">
  <label>数量</label>
  <input type="number" name="quantity[]" class="form-control" placeholder="输入数量">
</div>
<button type="button" onclick="addNewPartGroup()">新增配件组</button>

Dynamic Add Function (JavaScript) #

Make sure your addNewPartGroup() function creates new fields with the same array-named attributes. For example:

function addNewPartGroup() {
  const container = document.querySelector('.part-container');
  const newGroup = container.cloneNode(true);
  
  // Clear input values in the cloned group
  newGroup.querySelectorAll('input').forEach(input => input.value = '');
  
  // Append the new group to the form
  container.parentNode.appendChild(newGroup);
}

This way, every new part/quantity pair gets added to the partName[] and quantity[] arrays respectively.

3. Backend Processing (PHP Example) #

Now in requisitionForm_process.php, you'll receive arrays instead of single values. You need to loop through them to save all entries to the database. Important: Always use prepared statements to prevent SQL injection!

<?php
// Get the arrays from POST data
$serialNumbers = $_POST['serialNumber'] ?? [];
$partNames = $_POST['partName'] ?? [];
$quantities = $_POST['quantity'] ?? [];

// Connect to your database (use PDO or mysqli)
$pdo = new PDO('mysql:host=your_host;dbname=your_db', 'user', 'pass');
$pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

// Prepare the insert statement (adjust table/column names to match yours)
$stmt = $pdo->prepare("INSERT INTO your_table (serial_number, part_name, quantity) VALUES (?, ?, ?)");

// Loop through each part group, and associate with each selected serial number
// Adjust this logic if your business requires a different relationship (e.g., one serial per part group)
foreach ($partNames as $index => $partName) {
  $quantity = $quantities[$index] ?? 0;
  if (!empty($partName) && $quantity > 0) {
    foreach ($serialNumbers as $serial) {
      $stmt->execute([$serial, $partName, $quantity]);
    }
  }
}
?>

Adjust the loop logic based on your actual business needs—for example, if each part group is linked to only one serial number, you'll need to ensure the arrays are aligned (e.g., each serial has a corresponding part/quantity pair).

Quick Check List #

• All multi-value/dynamic fields have names ending with []
• Dynamic field creation maintains the array name structure
• Backend code loops through the received arrays instead of grabbing single values
• Always use prepared statements for database inserts to avoid security risks

内容的提问来源于stack exchange，提问作者jbabe