使用appendChild上传同名多输入框，提交后数据库数据重复问题排查

问题场景 #

前端通过克隆带有name="xxx[]"的表单元素，批量提交多组数据，后端Laravel处理时，选择3个文件上传后，数据库中所有数据完全重复。

问题代码分析 #

后端控制器代码存在核心问题：

• 外层for循环依赖不存在的$request->id字段，循环逻辑完全多余，导致内部代码重复执行。
• 存在文件时，先遍历文件创建数据，随后又遍历title执行更新，更新条件where('image_fill', $request->file('image_fill'))错误（文件对象集合无法匹配数据库字段），导致所有记录被重复更新。
• 多层循环嵌套触发多次数据写入，最终造成重复数据。

修复后的控制器代码 #

// 以title数组长度作为数据组数基准（每个克隆块必含title）
$contentCount = count($request->title);

for ($i = 0; $i < $contentCount; $i++) {
    // 组装基础数据
    $data = [
        'title' => $request->title[$i],
        'description' => $request->description[$i] ?? '',
        'input_id' => $request->input_type[$i],
        'form_id' => $forms->id
    ];

    // 处理当前索引对应的文件（确保文件存在且对应）
    if ($request->hasFile('image_fill') && isset($request->image_fill[$i])) {
        $file = $request->image_fill[$i];
        // 执行文件存储（示例：存储到public磁盘的form_images目录）
        $file->store('form_images', 'public');
        $data['image_fill'] = $file->hashName();
    }

    // 单次创建对应组的数据
    Form_content::create($data);
}

额外注意事项 #

• 前端克隆元素时，移除重复的id属性（或保证id唯一），避免JS操作冲突（表单提交仅依赖name属性）。
• 确保Form_content模型配置了可批量赋值的字段：

// Form_content模型
protected $fillable = ['title', 'description', 'image_fill', 'input_id', 'form_id'];

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