如何在 Laravel 中通过 Ajax 提交表单答案

【问题标题】：How to submit forms via Ajax in Laravel如何在 Laravel 中通过 Ajax 提交表单
【发布时间】：2016-08-24 20:54:41
【问题描述】：

我只是想知道如何在 Laravel 中使用 Ajax 提交表单

Laravel 本身并未在其文档中提供有用的提示或工作流程

是否有一些有用的库可以作为 jquery 的扩展？

我正在寻找不显眼的 javasctipt 解决方案

【问题讨论】：

标签： jquery ajax laravel workflow

【解决方案1】：

您正在寻找https://github.com/whipsterCZ/laravel-ajax

它完全满足您的需求还有更多！

通过 ajax 发送表单就像这样简单 - 无需配置

HTML

<form action="" class="ajax">...</form>

控制器

public function update(ClientRequest $request, Client $client)
{
    $client->update($request->all());
    $request->session()->flash('success', 'Client has been updated.');

    return \Ajax::redirect(route('clients.index'));
}

它还验证表单（通过自定义 FormRequest）并显示错误（在 errorBag 中或直接在输入上方）

【讨论】：

它基本上是 Laravel 的 AJAX 工作流。如果您熟悉 Nette 框架，那么您就在家中......

【解决方案2】：

这里是一个使用 jquery 的例子

$(document).ready(function()
                      {
                       $(document).on('submit', '#reg-form', function()
                       {
                      var data = $(this).find("#post_id").val();
                        $.ajax({
                        type : 'POST',
                        url  : '{{url("/ajax")}}',
                       data: {'name':data, '_token': $('input[name=_token]').val()},
                       success: function(data) {
                       //do stuff
                      },

                            error :  function(data)
                            {
                                alert("Fix thist");
                            }
                        });
                        return false;
                       });

                      });

控制器

if (\Request::ajax()) {
    // Do stuff
            return response()->json('success');
        }

这样的例子有什么问题？

【讨论】：

【解决方案3】：

在同一个域中

我的 form.blade.php

<form action=""  id="contact-form" class="form-contact">
    <input type="text" name="name" id="contact_name" placeholder="Name">
    <input type="email" name="email"id="contact_email"   placeholder="Email">
    <textarea name="message"  id="contact_message"  placeholder="Message"></textarea>
    <input type="submit" class="bnt-submit" value="Send">
</form>

我的函数.js

$("#contact-form").submit(function(){
     formulario =  $("#contact-form");
          url =  "http:://MyDomin/sendContacto";
                    $.ajax({
                        method: "POST",
                        url: url,
                        data: formulario.serialize()
                    })
                        .done(function( response ) {
                            msg = ' <div class="alert alert-success" role="alert">'+arrMsgs[lang]["message_send"]+'</div>';
                            $("#messages").append(msg);
                        });
})

在 routes.php 中添加路由 sendContact 并分配函数sencContacto

在我的控制器@sendcontacto

public function sendContacto(Request $request)
{
    $name = $request->input("name");
    $email = $request->input("email");
    $message = $request->input("message");
//Do something
}

【讨论】：