当前位置: 首页 > 资讯 >

Laravel - jQuery AJAX 范例

最近满常要把一般 form-submit 改成 AJAX 非同步去送表单,所以分享个 template。
非 Laravel 做的後端也适用

<form id="form">
    <!-- inputs -->
    <button type="submit" id="submit">
        submit
    </button>
</form>
<script>
    $('#submit').click(function(e){
        e.preventDefault();
        var form = new FormData(document.getElementById('form'))
        $.ajax({ 
            url: "/api/endpoint",
            data: form,
            type: 'post',
            processData: false, // important
            contentType: false, // important
            cache: false,
            success: function(data)
            {
                console.log(data)
                // redirect
                window.location.replace(data.redirect);
            },
            error: function(data)
            {
                // intergrate Swal to display error
                Swal.close();
                if (data.status == 419) {
                    window.location.reload();
                } else {
                    Swal.fire({
                        icon: 'info',
                        title: 'Error',
                        html: data.responseJSON.message,
                    });
                }
            }
        });
    })
</script>

Laravel Response 范例

  • json 看前端需要什麽,没有一定规定
  • status code 可参考 HTTP 状态码,建议不要无脑 200
return response()->json([
    'message' => 'message ...',
    'redirect' => 'https://example.com/path'
], 200);

相关文章:

  • 拿 ml5 来练习 如何载入别人的情绪给自己的电脑 (四)
  • 【Day 12】使用 Systems Manager 的 Parameter Store 保存变数
  • Day29百变红酱-义大利肉酱
  • [Day14] 传值或传址(上)
  • Unity与Photon的新手相遇旅途 | Day12-血量制作
  • 【Day30】完赛感言
  • Day28 黯然消魂饭-自制蜜汁叉烧
  • 【原创】自制资料库管理工具 - JasonQuery
  • 【8】资料集有没有事先 shuffle 对训练所产生的影响
  • 使用程序来管理资料库(DB Migrate) (Day27)
  • [Day-21] R语言 - 分群应用(二) 离群值侦测 - 下 ( detect outlier by clustering in R.Studio )
  • GitHub Branch 策略 - 哪一种方式适合你?
  • Day 1 : 前言与DevOps
  • Day12 Let's ODOO: Security(1) Access right
  • <Day3>当代的网路金融环境
  • 正规社交寻海外cps、网盟合作
  • 国外代发货教程:教你如何一件代发做跨境电商国外市场
  • 阿里云需要实名认证吗?阿里云个人可以做企业认证吗
  • 一键脚本/Superspeed: 一键测试服务器到国内的速度
  • 阿里云OSS对象存储控制客户端
  • WordPress建立数据库连接时出错怎么办?
  • 让 Rank Math SEO 输出关键词 keywords meta 字段信息
  • VPS优惠:搬瓦工香港VPS补货/G口/KVM/月付9.9美元
  • PayPal绑定国内手机卡的方法:国外PayPal怎么绑定国内手机号
  • Pinterest的商业指南(信息图):为什么以及如何在在Pinterest上推广你的业务
  • 韩国Moack蘑菇CN2服务器评测和特价服务器,优惠码
  • WordPress禁用古腾堡编辑器全屏模式
  • 国外VPS服务器主机为什么比较便宜?
  • 企业网站如何无损换域名
  • WordPress 5.7.1 修复2个安全问题,请及时更新