.parents（）がテーブル上で動作しない

Question

私はAJAX JQueryを使用してユーザーリストにユーザーの詳細を表示しようとしていますが、必要に応じて機能しません。 同じtrの私の最初の細部のために働いていますが、2行目のtdの2番目の詳細では動作しません。私はそれをどのように正しく行うべきですか？ここで

はコードです：

マイビュー：

<table class="table"> 
     <thead> 
      <th>#</th> 
      <th>name</th> 
      <th>password</th> 
      <th></th> 
     </thead> 
     <tbody> 
     @foreach($users as $user) 
      <tr> 
       <table class="table"> 
        <tr> 
         <td>{{$user->id}}</td> 
         <td>{{$user->name}}</td> 
         <td>{{$user->password}}</td> 
         <td class="extend-user" data-details="0" data-url="{{route("user", ["id" => $user->id])}}">Details</td> 
         <td id="details">a</td> 
        </tr> 
        <tr> 
         <td colspan="5" id="details">a</td> 
        </tr> 
       </table> 
      </tr> 
     @endforeach 
     </tbody>  
    </table> 

と私のスクリプト：

$(".extend-user").click(function() { 
    var self = this; 

    if($(self).data("details")===0) 
    $.ajax({ 
     method: "POST", 
     url: $(self).data("url"), 
     data: { 
      _token: $("#_token").val() 
     }, 
     success: function(data) { 
      $(self).parents().find("#details").append(data["name"]); 
      //$(self).parent().parent().find("#details").append(data["name"]); 
      //$(self).closest('table').find("#details").append(data["name"]);; 
      $(self).data("details", "1"); 
     } 
    }); 
    if($(self).data("details")===1) { 
     $(self).data("details", "0"); 
     $(self).parent().find("p.details").html(""); 
    } 
}); 

Answer 1

が$(self).closest("table").find("#details").append(data["name"]);

最も近いが、そのあなたの最も近い親要素を見つけるを使用してみてください見つけたい

Answer 2

$(self).parents('tr').find("#details").append(data["name"]);