动态表单重复输入名称处理及PHP获取所有输入值的方法

这是个很常见的动态表单数据提交坑，我来给你捋捋最省心的解决办法～

你当前的表单里，所有重复的输入框都用了相同的name属性（比如mobile、name），表单提交时，PHP的$_POST会自动覆盖之前的同名值，最后就只留下最后一个输入框的内容，这就是你拿不到所有值的原因。

这是PHP处理多值输入的标准操作，只需要把输入框的name改成数组格式，后端就能直接拿到所有输入值组成的数组，处理起来超方便。

修改后的完整代码 #

HTML部分 #

把原来的name="name"改成name="name[]"，name="mobile"改成name="mobile[]"即可：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="#" method="post">
 <div class="company_members">
 <input class="staff_name" type="text" name="name[]" required placeholder="name" />
 <input class="staff_mobile" type="text" name="mobile[]" required placeholder="mobile" />
 <hr />
 </div>
 <input type="button" class="add_more_staff" value="Add more staff" />
 <input type="submit" value="register_company_staffs" />
</form>

jQuery代码无需改动 #

克隆的时候会自动继承name[]的属性，新添加的输入框自然也会保持这个格式：

$(".add_more_staff").on("click", function(){ 
  var $newMember = $(this).siblings('.company_members').clone(); 
  $newMember.insertBefore($(this)); 
})

PHP后端处理示例 #

现在$_POST['name']和$_POST['mobile']都是数组了，你可以用循环轻松遍历所有员工的数据：

// 先判断是否有提交的数据
if(isset($_POST['name']) && isset($_POST['mobile'])){
    // 遍历每一组员工信息
    foreach($_POST['name'] as $index => $staffName){
        $staffMobile = $_POST['mobile'][$index];
        // 这里可以做你需要的操作，比如插入数据库、验证数据等
        echo "员工姓名：{$staffName}，手机号：{$staffMobile}<br>";
    }
}

• 方案1：给新输入框设置name="mobile-n"（n=1,2…）
  这种方式虽然能实现需求，但后端处理会非常繁琐——你得先判断有多少个带编号的mobile字段，再逐个取值，代码冗余还不好维护，完全没必要舍近求远。

• 其他小众方法
  比如用JavaScript收集所有输入值拼成JSON字符串再提交，但这需要额外的前端处理逻辑，后端还要解析JSON，比直接用数组命名的成本高很多，属于画蛇添足的操作。

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