jQuery-需要帮助删除表行

时间:2018-07-09 10:57:53

标签: jquery ajax

如何删除带有当前按钮的行(tr)

这是我的代码

<td> 
  <button onClick="deleteparticipant({{$participant->id}})" class="deletebutton">Delete</button> 
</td>

脚本:

var token = document.getElementById('_token').value;

      function deleteparticipant(i) {
          alert (i);
          var tr = $(this).closest('tr');
          $.ajax({
              type:"post",
              url:"<?= URL::to('/deleteparticipant')?>",
              dataType:"json",
              data:{
                  'participantid':i,
                  '_token':token
              },

              success: function(data){

                  tr.fadeOut(1000, function(){
                      $(this).remove();
                  });      ==> didnot work :(
              }
          });

      }

PHP:

public function deleteparticipant(Request $request)
    {
        $id = $_POST['participantid'];

        $participant=participants::find($id);

        $participant->delete();

       return response()->json(['status' => 'done']);

    }

任何帮助将不胜感激

1 个答案:

答案 0 :(得分:0)

this回调函数中的

success未引用您当前的元素,您可以为this声明一个变量,然后在success函数中将其删除

  function deleteparticipant(i) {
      alert (i);
      var tr = $(this).closest('tr');
      var obj = $(this);
      $.ajax({
          type:"post",
          url:"<?= URL::to('/deleteparticipant')?>",
          dataType:"json",
          data:{
              'participantid':i,
              '_token':token
          },

          success: function(data){

              tr.fadeOut(1000, function(){
                 obj.remove();
              });     
          }
      });

  }