使用 Ajax 提交表单答案

【问题标题】：Submit a form using Ajax使用 Ajax 提交表单
【发布时间】：2017-02-04 22:52:45
【问题描述】：

首先，这是我的代码：

routes.php

$router->resource('vips','formController');

formController.php（我只发布相关函数）

public function store(CreateVipRequest $request, Vip $vip, Pool $pool, Url $url)
{
    $new_vip = $vip->create($request->except(['srv_hostname', 'srv_ip', 'srv_port','url']));
    $pool->fill($request->only(['srv_hostname', 'srv_ip', 'srv_port']));
    $url->fill($request->only(['url']));

     /* Some more inserts on the database...*/

    return redirect()->route('vips.show', [DB::table('vips')->max('id')]);
}

我的代码提交表单，并在向远处的 Api（和一些数据库插入）发出一些 json 请求后，它重定向到显示视图。

现在我想添加第二个通过 Ajax 提交表单的按钮。

问题：有没有办法使用相同的功能store？我需要它能够同时处理 ajax 提交和普通提交。

【问题讨论】：

您可能想在action中使用表单的'Post'，然后通过ajax序列化后提交表单数据。

标签： javascript php ajax laravel laravel-5.1

【解决方案1】：

使用 ajax 提交表单

$("#form-name").submit(function(ev){
  ev.preventDefault();  
  var formURL = $(this).attr("action");
  var postData = $(this).serializeArray(); 
  $.ajax({
    url: formURL,
    type: 'POST',
    data: postData,
    success: function(data, textStatus, jqXHR){
      location.reload();
    },
    error: function(jqXHR, textStatus, errorThrown){
      var errResponse = JSON.parse(jqXHR.responseText);
    },
  });
});

【讨论】：

【解决方案2】：

是的，你可以。

在您的 javascript 中，您可以执行以下操作（假设您使用的是 jquery）：

// if you're using a form
var data = $('form').serialize();

// if data comes from elsewhere
var data = {foo: 'bar', ...};

$.ajax({
  type: 'POST',
  url: url,
  data: data,
  dataType: 'json',
  success: function (data) {
    // Do something if everything went fine
  },
  error: function (jqXHR, textStatus, errorThrown) {
    // Do something if something went wrong
  },
});

您的控制器将捕获来自请求的数据，就像您已经在做的那样。

【讨论】：