테이블 부트 스트랩의 드롭 다운 테이블

많은 엔티티가있는 테이블이 있습니다. 행 중 하나를 클릭하면 그 아래 엔 엔티티에 대한 세부 정보가있는 다른 테이블 드롭 다운이 있습니다.테이블 부트 스트랩의 드롭 다운 테이블

데이터로드는 Ajax로 수행되며, 해당 부분을 다룰 것입니다.

테이블에 테이블을 만드는 방법은 무엇입니까?

<table class="table table-striped"> 
    <thead> 
     <tr> 
      <th></th> 
      <th>Name</th> 
      <th>Status</th> 
      <th>Contact Person</th> 
      <th>Phone</th> 
      <th>Email</th> 
      <th>Follow Up</th> 
      <th>Responsible</th> 
     </tr> 
    </thead> 
    <tbody> 
     @foreach (var partner in Model) 
     { 
      <tr> 
       <td id="@partner.Partner.Id" onclick="LoadPartnerData(@partner.Partner.Id)"><a href="#"><span class="glyphicon glyphicon-chevron-down"></span></a></td> 
       <td>@partner.Partner.Name</td> 
       <td>@partner.Partner.Status</td> 
       <td>@partner.Partner.PrimaryContactPerson</td> 
       <td>@partner.Partner.PrimaryContactPhone</td> 
       <td>@partner.Partner.PrimaryContactEmail</td> 
       <td>@partner.Partner.FollowUp.ToStandardDateString()</td> 
       <td>@partner.Partner.ResponsiblePerson</td> 
      </tr> 
      <table class="table table-striped hidden"> 
       <thead> 
        <tr> 
         <th></th> 
         <th>Report Id</th> 
         <th>Payment Date</th> 
         <th></th> 
         <th></th> 
         <th></th> 
         <th></th> 
         <th>Download</th> 
        </tr> 
       </thead> 
       <tbody id="[email protected]"> 

       </tbody> 
      </table> 
     } 
    </tbody> 
</table>

출처

2016-07-13 Jannik

그리고 이걸 시도한 코드 는요? –

나는 그것을 거기에서 가지고 있었다, 잊었을 것임에 틀림 없었다. 나는 이것을 – Jannik

colspan을 사용하여 이것을 추가했다 :) –

당신처럼, 자책골을 tr에 넣을 수 있습니다

<table class="table table-striped"> 
    <thead> 
     <tr> 
      <th></th> 
      <th>Name</th> 
      <th>Status</th> 
      <th>Contact Person</th> 
      <th>Phone</th> 
      <th>Email</th> 
      <th>Follow Up</th> 
      <th>Responsible</th> 
     </tr> 
    </thead> 
    <tbody> 
     @foreach (var partner in Model) 
     { 
      <tr> 
       <td id="@partner.Partner.Id" onclick="LoadPartnerData(@partner.Partner.Id)"><a href="#"><span class="glyphicon glyphicon-chevron-down"></span></a></td> 
       <td>@partner.Partner.Name</td> 
       <td>@partner.Partner.Status</td> 
       <td>@partner.Partner.PrimaryContactPerson</td> 
       <td>@partner.Partner.PrimaryContactPhone</td> 
       <td>@partner.Partner.PrimaryContactEmail</td> 
       <td>@partner.Partner.FollowUp.ToStandardDateString()</td> 
       <td>@partner.Partner.ResponsiblePerson</td> 
      </tr> 
      <tr> 
       <td colspan="8" class="further-information"> 
        <table class="table table-striped hidden"> 
         <thead> 
          <tr> 
           <th></th> 
           <th>Report Id</th> 
           <th>Payment Date</th> 
           <th></th> 
           <th></th> 
           <th></th> 
           <th></th> 
           <th>Download</th> 
          </tr> 
         </thead> 
         <tbody id="[email protected]"> 

         </tbody> 
        </table> 
       </td> 
      </tr> 
     } 
    </tbody> 
</table>

그리고이 tr 예를 들어,의 정보를 전환 클래스 further-information.

출처

2016-07-13 09:28:24 Sergej

테이블 부트 스트랩의 드롭 다운 테이블

답변

관련 문제