데이터 테이블에 항목 표시

Question

이것은 일반적인 html 테이블의 모습입니다. 표에서 국가를 탭으로 표시하고 사용자가 클릭하는 모든 탭에서 표는 특정 국가 (탭)에 속한 팀을 표시합니다. 이것은 잘 작동합니다.

 <div class="nav-tabs-custom" id="tabs"> 

     <ul id="myUL" class="nav nav-tabs"> 
     @foreach($countries as $country) 

      <li ><a href="#tab_{{ $country->id }}" data-toggle="tab" >{!!$country->name!!}</a></li> 
      @endforeach 


     </ul> 
     <div class="tab-content"> 
     @foreach($countries as $key => $country) 

      <div class="tab-pane" id="tab_{{ $country->id }}"> 
      <table class="table" id="tables"> 
          <thead> 
           <tr> 
            <th></th> 
            <th colspan="5"></th> 
            <th></th> 
           </tr> 
          </thead> 
          <tbody id="list"> 
      @foreach($country->teams as $team) 
          <td><input onclick="return show(this)" data-team="{{$team->toJson()}}" type="checkbox" id="{!! $team->id !!}" name="{!! $team->name !!}" value="{!! $team->value !!}" /> </td> 
            <td width="600">{{$team->name }}</td> 
            <td>{{ $team->value}}</td> 
           </tr> 
      @endforeach   
     </tbody> 
     </table> 
     </div> 
     @endforeach  
      </div>  

     </div> 

그러나 지금, 나는 datatables 새로운 오전 그리고 난

이

public function create() 
    { 
     $countries = Country::where('id', Auth::user()->id)->get(); 
     return view('create',compact('countries')); 
    } 

    public function getTeams() 
    { 
     $countries = Country::where('id', Auth::user()->id)->get();  

     return Datatables::of($countries)->addColumn('check', function ($country) { 
      foreach($country->teams as $team){ 

      return ' 
      <input onclick="return show(this)" data-team="{{$team->toJson()}}" type="checkbox" id="{!! $team->id !!}" name="{!! $team->name !!}" value="{!! $team->value !!}" /> 
      '; 
      } 
      })->addColumn('team_name', function ($country) { 
       foreach($country->teams as $team){ 
       return $team->name; 
       } 
      })->addColumn('team_value', function ($country) { 
       foreach($country->teams as $team){      
       return $team->value; 

       } 
      }) 

->make(true); 
    } 

이제 내 문제는

 <div class="nav-tabs-custom" id="tabs"> 

     <ul id="myUL" class="nav nav-tabs"> 
     @foreach($countries as $country) 

      <li ><a href="#tab_{{ $country->id }}" data-toggle="tab" >{!!$country->name!!}</a></li> 
      @endforeach 


     </ul> 
     <div class="tab-content"> 
     @foreach($countries as $key => $country) 

      <div class="tab-pane" id="tab_{{ $country->id }}"> 
      <table class="table" id="tables"> 
          <thead> 
           <tr> 
            <th></th> 
            <th colspan="5"></th> 
            <th></th> 
           </tr> 
          </thead> 

     </table> 
     </div> 
     @endforeach  
      </div>  

     </div> 


<script type="text/javascript"> 
$(document).ready(function() { 

     oTable = $('#tables').DataTable({ 
      "processing": true, 
      "serverSide": true, 
      "bProcessing":false, 
      "bSort":false, 
      "ajax": "{{ route('datatable.findteam') }}", 
      "columns": [ 
       {data: 'check', name: 'check', orderable: false, searchable: false},  
       {data: 'team_name', name: 'team_name'}, 
       {data: 'team_value', name: 'team_value'}, 
      ],   
     }); 

}); 
</script> 

아래 컨트롤러로 datatables에 html로 변환하려고 내 프로젝트를 실행하면 로그인 한 사용자의 팀을 표시 할 수 있지만 팀을 해당 국가로 분류 할 수는 없습니다.

PS : 당신이 작동하는 일반 HTML 테이블에 보면, 당신은 내가 탭의 컨텐츠 실제로

Answer 1

@foreach($countries as $key => $country) 

      <div class="tab-pane" id="tab_{{ $country->id }}"> 
      <table class="table" id="tables_{{ $country->id }}"> 
          <thead> 
           <tr> 
            <th></th> 
            <th colspan="5"></th> 
            <th></th> 
           </tr> 
          </thead> 

     </table> 
     </div> 
     @endforeach  

당신이 테이블을 반복하는 그들의 각각의 국가에서 팀을 분류 할 수 있음을 볼 수있다 동일한 ID tables 그래서 당신은 예상처럼 그 실 거예요 작업,

은

@foreach 
<script type="text/javascript"> 
$(document).ready(function() { 

     oTable = $('#tables_{{ $country->id }}').DataTable({ 
      "processing": true, 
      "serverSide": true, 
      "bProcessing":false, 
      "bSort":false, 
      "ajax": "{{ route('datatable.findteam') }}", 
      "columns": [ 
       {data: 'check', name: 'check', orderable: false, searchable: false},  
       {data: 'team_name', name: 'team_name'}, 
       {data: 'team_value', name: 'team_value'}, 
      ],   
     }); 

}); 
</script> 
@endforeach 

하면 마지막처럼뿐만 아니라 스크립트를 foreach는 y 국가 ID를 경로에 전달하고 그에 따라 컨트롤러를 변경하면 작동합니다 ..