提交表单并在 <a> 点击时调用 Ajax

Question

我想使用 Ajax 向数据库添加一些内容。我有一个提交表单的链接，然后 Ajax 调用应该可以工作，但事实并非如此。我在不同的页面上使用相同的 Ajax 调用，但在该表单中，我使用的是带有提交类型的简单按钮。但是在这个页面上，我想提交 ...

这是表格

{!! Form::open(['id' => 'ajax-form', 'style' => 'float:right']) !!}
  <input type="hidden" name = "idUser" id="idUser" value="{{Auth::user()->id}}">
  <input type="hidden" name = "idCampaign" id="idCampaign" value="{{$campaign->id}}">
  <a class="fa fa-bookmark fa-2x" onclick="document.getElementById('ajax-form').submit();" aria-hidden="true" href="javascript:{}" style="color:#fd8809"></a>
{!! Form::close() !!}

这是阿贾克斯：

$("#ajax-form").submit(function(event) {
    event.preventDefault();
    var form = $(this);
    $.ajax({
        type: "post",
        url: "{{ url('addFavorites') }}",
        dataType: "json",
        data: form.serialize(),
        success: function(data){
            if(data.status == 'failedd'){
              swal("Error!", "You have already added this campaign to favorites! If you want to remove it, go to your Favorites list page", "error")
            }
            else{
            swal("Success!", "You added the campaign "+ data.idCampaign + " to favorites!", "success")
          }
        },
        error: function(data){
            swal("Error!", "error")
        },
        complete: function (data) {
     }
    });
});

当我单击此链接时，它会将我重定向到另一个页面，该页面会抛出：MethodNotAllowedHttpException。

Answer 1

将您的 ajax 网址更改为：

url: '/addFavorites',

和你的路线：

Route::post('/addFavorites', 'SearchController@addFavorites');

只是为了确保您指向相同的网址

编辑：

确保您有一个带有 get 的路由和同一条带有 post 的路由。见下文：

Route::get('/addFavorites', 'SearchController@loadFavorites');

Route::post('/addFavorites', 'SearchController@submitFavorites');

1. 改变这个：$("#ajax-form").submit(function(event) {

   对此：$('#yourid').click(function(){

2. 删除“a”元素中的 onclick，并添加 id='yourid' 并使用您想要的名称。

Answer 2

MethodNotAllowedHttpException 通常发生在您尚未定义路由或您已为 get 方法定义路由并且您正在使用该路由用于 post 方法时。请检查你的 routes.php