動的なタブでデータを取得

Question

ここでは、タブをクリックして自分のデータを取得しようとしています。私はそれをうまくやって、本当に1つの生データのみを取り出しますか？どんな助け？

<div class="col-lg-12"> 
     <div class="tabs-container"> 
     <ul class="nav nav-tabs"> 
      @foreach($departments as $department) 
      <li class=""><a data-toggle="tab" href="#tab-{{ $department->id }}" aria-expanded="false">{{ $department->name }}</a></li> 
      @endforeach 


     </ul> 
     <div class="tab-content"> 
      @foreach($works as $work) 
      <div id="tab-{{ $work->department_id }}" class="tab-pane"> 
      <div class="panel-body"> 
       <div class="row employees"> 

       <div class="col-md-3"> 
        <div class="thumbnail"> 
        <div class="image view view-first"> <img class="img-responsive" src="" name="imaged" alt="image"> </div> 
        <div class="caption"> 
         <h4>{{ $work->address }} </h4> 
         <p>{{ $work->body }}</p> 
        </div> 
        </div> 
        <a class="btn btn-primary" href="edit-portfolio.html"> تعديل</a> 
        <button class="btn btn-danger demo4"> حذف 
        </button> 
       </div> 


       </div> 
      </div> 
      </div> 
      @endforeach 
     </div> 
     </div> 
    </div> 
    <!-- --> 
    </div> 

なぜ私は部門ごとに1つのレコードしか得られないのかという理由が誰かにあるとすれば、それをajaxにする必要はありませんか？

Answer 1

部門のレコードを1つ取得する理由は、作業ごとに1つのタブパネルを作成することです。たとえば、2つの作品（1,2）が1つの部門に属している場合（1）、結果は2つのタブ1に同じIDセット：

部門：

id  
----- 
1 

作品：

id  department_id 
--------------------- 
1  1 
2  1 

のHTML結果：

<div id="tab-1" class="tab-pane"> 
    ... 
</div> 
<div id="tab-1" class="tab-pane"> 
    ... 
</div> 

両方のタブのIDが同じtab-1であることに注意してください。

グループは、DEPARTMENT_IDで働く

ソリューション、このような何か：あなたのビューで

$works = Work::all()->groupBy('department_id'); 

、その後：

<div class="tab-content"> 
    @foreach($works as $department_id => $department_works) 
     <div id="tab-{{ $department_id }}" class="tab-pane"> 
      <div class="panel-body"> 
       <div class="row employees"> 
        @foreach($department_works as $work) 
        <div class="col-md-3"> 
         <div class="thumbnail"> 
          <div class="image view view-first"> <img class="img-responsive" src="" name="imaged" alt="image"> </div> 
          <div class="caption"> 
           <h4>{{ $work->address }} </h4> 
           <p>{{ $work->body }}</p> 
          </div> 
         </div> 
         <a class="btn btn-primary" href="edit-portfolio.html"> تعديل</a> 
         <button class="btn btn-danger demo4"> حذف </button> 
        </div> 
        @endforeach 
       </div> 
      </div> 
     </div> 
    @endforeach 
</div> 

希望これは