如何在 Laravel 中正确接收 jQuery 动态添加的多组表单数组数据

千宇大大_7861

千宇大大_7861

2026-06-30

504人浏览

原创

如何在 Laravel 中正确接收 jQuery 动态添加的多组表单数组数据

本文详解如何通过统一命名(如 name="degree[]")使 jquery 动态生成的多组教育信息(学位、院校、毕业年份)在 laravel 中完整提交为关联数组,并在控制器中安全解析为结构化数据。

本文详解如何通过统一命名(如 name="degree[]")使 jquery 动态生成的多组教育信息(学位、院校、毕业年份)在 laravel 中完整提交为关联数组,并在控制器中安全解析为结构化数据。

在 Laravel 表单处理中,若需提交多组同类字段(如多段教育经历),关键在于所有同类型输入框必须使用带方括号的数组式 name 属性(如 name="degree[]"、name="clg[]"、name="yoc[]"),且各字段在 DOM 中按逻辑顺序成组排列。否则,PHP/Laravel 仅能接收到第一个或零散的值,无法还原完整数据结构。

✅ 正确的 HTML 结构(Blade 模板)

确保初始表单及动态追加的 HTML 均为数组化命名 + 成组嵌套:


@csrf

✅ jQuery 动态添加逻辑(关键修复点)

原代码中新增 HTML 缺少 name="degree[]" 和 name="clg[]",导致后端无法收集全部字段。修正如下:

Laravel Creem Agent
Laravel Creem Agent

Creem 支付商店助理 — 查询订阅、客户、交易、产品,执行心跳检查,管理本地 Laravel支付商店。

下载
$(".add-education").on('click', function () {
    const educationContent = `
        <div class="row form-row education-cont mb-2">
            <div class="col-12 col-md-10 col-lg-11">
                <div class="row form-row">
                    <div class="col-12 col-md-6 col-lg-4">
                        <div class="form-group">
                            <label>Degree</label>
                            <input type="text" name="degree[]" class="form-control" value="">
</div>
                    </div>
                    <div class="col-12 col-md-6 col-lg-4">
                        <div class="form-group">
                            <label>College/Institute</label>
                            <input type="text" name="clg[]" class="form-control" value="">
</div>
                    </div>
                    <div class="col-12 col-md-6 col-lg-4">
                        <div class="form-group">
                            <label>Year of Completion</label>
                            <input type="text" name="yoc[]" class="form-control" value="">
</div>
                    </div>
                </div>
            </div>
            <div class="col-12 col-md-2 col-lg-1">
                <label class="d-md-block d-sm-none d-none"> </label>
                <a href="#" class="btn btn-danger trash"><i class="far fa-trash-alt"></i> Remove</a>
            </div>
        </div>`;

    $(".education-info").append(educationContent);
});

// 删除逻辑(保持不变)
$(".education-info").on('click', '.trash', function (e) {
    e.preventDefault();
    $(this).closest('.education-cont').remove();
});

⚠️ 注意: 标签需加 e.preventDefault() 防止页面跳转;所有 input 必须带 name="xxx[]",且 degree[]、clg[]、yoc[] 的索引位置严格对齐(即第 i 个 degree[] 与第 i 个 clg[]、yoc[] 属于同一教育记录)。

✅ Laravel 控制器安全解析(推荐写法)

使用 request()->input() 显式获取并校验数组,避免空指针异常:

public function drprofilesettingpost(Request $request)
{
    // 获取所有字段数组(自动按索引对齐)
    $degrees = $request->input('degree', []);
    $colleges = $request->input('clg', []);
    $years = $request->input('yoc', []);

    // 合并为结构化教育记录数组
    $educations = [];
    $count = min(count($degrees), count($colleges), count($years));

    for ($i = 0; $i  trim($degrees[$i]),
                'college' => trim($colleges[$i]),
                'year_of_completion' => trim($years[$i]),
            ];
        }
    }

    // ✅ 此时 $educations 是完整、有序、去空的教育记录数组
    // 示例输出:
    // [
    //   ['degree' => 'BCA', 'college' => 'KSV', 'year_of_completion' => '2012'],
    //   ['degree' => 'MCA', 'college' => 'KSV', 'year_of_completion' => '2017']
    // ]

    // 后续可存入数据库、验证、返回响应等
    return response()->json(['educations' => $educations]);
}

? 关键总结

  • 命名一致性:所有动态字段必须使用 name="xxx[]",不可遗漏;
  • DOM 结构对齐:每个 .education-cont 内部的 degree[]、clg[]、yoc[] 必须同级、同序;
  • 后端防御性处理:用 input('field', []) 提供默认空数组,再通过 min(count()) 防止索引越界;
  • 验证建议:实际项目中应在 $request->validate() 中加入数组规则,例如 'degree.*' => 'required|string|max:100'。

遵循以上模式,即可稳定接收任意数量的动态教育信息,并在 Laravel 中高效转化为可用数据结构。

相关文章

PHP速学视频免费教程(入门到精通)
PHP速学视频免费教程(入门到精通)

PHP怎么学习?PHP怎么入门?PHP在哪学?PHP怎么学才快?不用担心,这里为大家提供了PHP速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

laravel jquery 表单提交

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
php文件怎么打开
php文件怎么打开

打开php文件步骤:1、选择文本编辑器;2、在选择的文本编辑器中,创建一个新的文件,并将其保存为.php文件;3、在创建的PHP文件中,编写PHP代码;4、要在本地计算机上运行PHP文件,需要设置一个服务器环境;5、安装服务器环境后,需要将PHP文件放入服务器目录中;6、一旦将PHP文件放入服务器目录中,就可以通过浏览器来运行它。

2023.09.01

9464

6

php怎么取出数组的前几个元素
php怎么取出数组的前几个元素

取出php数组的前几个元素的方法有使用array_slice()函数、使用array_splice()函数、使用循环遍历、使用array_slice()函数和array_values()函数等。本专题为大家提供php数组相关的文章、下载、课程内容,供大家免费下载体验。

2023.10.11

5701

5

php反序列化失败怎么办
php反序列化失败怎么办

php反序列化失败的解决办法检查序列化数据。检查类定义、检查错误日志、更新PHP版本和应用安全措施等。本专题为大家提供php反序列化相关的文章、下载、课程内容,供大家免费下载体验。

2023.10.11

2055

5

php怎么连接mssql数据库
php怎么连接mssql数据库

连接方法:1、通过mssql_系列函数;2、通过sqlsrv_系列函数;3、通过odbc方式连接;4、通过PDO方式;5、通过COM方式连接。想了解php怎么连接mssql数据库的详细内容,可以访问下面的文章。

2023.10.23

3568

4

php连接mssql数据库的方法
php连接mssql数据库的方法

php连接mssql数据库的方法有使用PHP的MSSQL扩展、使用PDO等。想了解更多php连接mssql数据库相关内容,可以阅读本专题下面的文章。

2023.10.23

4234

6

html怎么上传
html怎么上传

html通过使用HTML表单、JavaScript和PHP上传。更多关于html的问题详细请看本专题下面的文章。php中文网欢迎大家前来学习。

2023.11.03

3331

9

PHP出现乱码怎么解决
PHP出现乱码怎么解决

PHP出现乱码可以通过修改PHP文件头部的字符编码设置、检查PHP文件的编码格式、检查数据库连接设置和检查HTML页面的字符编码设置来解决。更多关于php乱码的问题详情请看本专题下面的文章。php中文网欢迎大家前来学习。

2023.11.09

4717

8

php文件怎么在手机上打开
php文件怎么在手机上打开

php文件在手机上打开需要在手机上搭建一个能够运行php的服务器环境,并将php文件上传到服务器上。再在手机上的浏览器中输入服务器的IP地址或域名,加上php文件的路径,即可打开php文件并查看其内容。更多关于php相关问题,详情请看本专题下面的文章。php中文网欢迎大家前来学习。

2023.11.13

3702

8

sprintf函数用法详解
sprintf函数用法详解

sprintf函数的用法:1、格式化字符串;2、指定输出宽度和精度;3、返回值。更多关于sprintf函数用法详解的内容,大家可以阅读下面的文章。

2023.11.27

11702

4

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
如何安装 Composer
如何安装 Composer

共1课时 | 191人学习

Composer手册
Composer手册

共0课时 | 0人学习