Laravel简单的毛病用jQuery的ajax

我想从表中删除一行使用jquery ajax。经过几次尝试，我不知道为什么我的代码（删除部分）不工作，因为我是新的Ajax和JavaScript。从服务器加载ajax的数据工作正常，脚本没有控制台错误。当我按删除时，我在网络标签上看不到任何东西。这里是我的代码：Laravel简单的毛病用jQuery的ajax

routes.php文件

Route::delete('users/{id}','[email protected]');

AjaxController.php

public function destroy($id) 
    { 
     $user = User::findOrFail($id); 
     $user->delete(); 
    }

观点：

<table id="users" class="table table-bordered"> 
      <thead> 
       <tr> 
       <th>Name</th> 
       <th>Phone</th> 
       <th>Action</th> 
       </tr> 
      </thead> 
      <tbody id="abc"> 

      </tbody> 
      </table>

脚本：

$(document).ready(function(){ 
     var $tbody = $('#abc'); 

     // getting data from server 
     $.ajax({ 
      type : 'GET', 
      url : 'api/users', 
      success: function(users) { 
      $.each(users, function(i, user){ 
       $tbody.append('<tr id="user_' + user.id + '"><td>'+user.name+'</td><td>'+user.phone+'</td><td><button type="button" class="btn btn-xs btn-danger" id="delete" value="'+user.id+'" name="button">Delete</button></td></tr>'); 
      }); 
      }, 
      error: function(){ 
      alert('error loading data'); 
      } 
     }); 

      // deleting data 
      $('#delete').on('click', function(e){ 
      var user_id = $(this).val(); 
      $.ajaxSetup({ 
       headers: { 
        'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content') 
       } 
      }) 
      e.preventDefault(); 
      var user = { 
       id : user_id 
      }; 
      $.ajax({ 
       type: 'DELETE', 
       url : '/user/'+user.id, 
       success : function(deleteUser) 
       { 
       $("#user_" + user_id).remove(); 
       }, 
       error : function() 
       { 
       alert('error deleting data'); 
       } 
      }); 
     }); // deleting block ends 
     }); 
    });

来源

2016-08-12 Noob Coder

http://itsolutionstuff.com/post/laravel-5-ajax-crud-with-pagination-example-and-demo-from-scratchexample.html – 2016-08-12 04:55:32

你确定，你正在得到正确的'$ id'在你的'destroy'函数中。尝试打印它。 –

当我按删除，我看不到任何网络选项卡（控制台）。 @ravishankar –

这里的问题是你一遍又一遍地使用相同的id。然而，这个问题由于您动态地插入内容这一事实而变得更加复杂，但您的事件绑定仅在页面加载时观察可用元素。我们来解决所有这些问题。首先，我们需要取消身份证。

class="btn btn-xs btn-danger" id="delete" value="'+user.id+'"

需要改变，以

class="btn btn-xs btn-danger btn-delete" value="'+user.id+'"

大。我们使用了btn-delete。这不是特定于此特定用户功能的。 CRUD的工作方式，您应该能够通过CRUD控制器为每个与您交互的单个模型重新使用此代码。

现在我们需要委托我们的事件绑定，并且我们也会按照前面段落中讨论的那样使按钮更通用。为了文章长度，我只会显示你应该让你的javascript设置。

$('table').on('click', '.btn-delete', function(e){ 
    e.preventDefault(); 

    var $btn = $(this), 
     $table = $btn.closest('table'); 

    $.ajax({ 
     url: $table.data('resource') . '/' . $btn.val(), 
     type: 'delete' 
    }).done(function(response){ 
     console.log(response); 
    }).error(function(x,t,m){ 
     console.warn(x,t,m); 
    }); 
});

令牌可以移动到文件的top，它并不需要嵌套：

$.ajaxSetup({ 
    headers: { 
     'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content') 
    } 
});

最后，我们需要把我们的data-resource属性附加到我们的餐桌：

<table ... data-resource="users"

现在你已经有了一个可重复使用的模型，只需要附加一个data-resource="model"属性到你的表中，并且一个按钮的类型为btn-delete实体的id的值。

来源

2016-08-12 05:30:59 Ohgodwhy

Laravel简单的毛病用jQuery的ajax

回答

相关问题