2016-07-29 18 views
1

Ich habe ein Problem mit dem Einblenden neuer Zeilen- und Plugin-Datatables.Bootstrap und Datatables Collapse Zeile

HTML/Rails-Code:

<table class="table table-bordered users-list"> 
<thead> 
<tr> 
    <th> 
    XXX 
    </th> 
    <th> 
    XXX 
    </th> 
    <th> 
    XXX 
    </th> 
    <th> 
    XXX 
    </th> 
    <th> 
    XXX 
    </th> 
    <th> 
    XXX 
    </th> 
    <th> 
    XXX 
    </th> 
    <th> 
    XXX 
    </th> 
</tr> 
</thead> 
<tbody> 
    <% @users.each do |u| %> 
    <tr data-toggle="collapse" data-target="#<%= u.id %>"> 
     <td> 
      <%= u.first_name %> 
     </td> 
     <td class="text-center"> 
      <%= u.last_name %> 
     </td> 
     <td class="text-center"> 
      <%= u.email %> 
     </td> 
     <td class="text-center"> 
      <%= u.provider %> 
     </td> 
     <td class="text-center"> 
      <%= u.device %> 
     </td> 
     <td class="text-center"> 
      <%= u.type %> 
     </td> 
     <td class="text-center"> 
      <%= u.messages.size %> 
     </td> 
     <td> 
      <%= link_to edit_user_path(u), class: 'btn btn-sm btn-default', title: 'Edit' do %> 
      <i class="fa fa-cog" aria-hidden="true"></i> 
      <% end %> 
      <%= link_to user_path(u), method: :delete, data: { confirm: 'Are you sure?' }, class: 'btn btn-sm btn-danger', title: 'Delete' do %> 
       <i class="fa fa-trash-o" title="Delete" aria-hidden="true"></i> 
      <% end %> 
     </td> 
     </tr> 
     <tr> 
     <td colspan="8" class="user-chart"> 
      <div id="<%= user.id %>" class="collapse"> 
      <%= u.chart %> 
      </div> 
     </td> 
     </tr> 
    <% end %> 
</tbody> 

Js Code:

$('.users-list').DataTable({ 
    language: { 
     search: '_INPUT_', 
     searchPlaceholder: 'Search users...' 
    }, 
    aoColumnDefs: [ 
     { bSortable: false, aTargets: [ 5 ] } 
    ] 
}); 

Wenn ich Zusammenbruch hinzufügen Ich habe diesen Fehler und Datentabellen nicht zu machen:

TypeError: nTd is undefined 

Ist es möglich? le, um eine Zeile hinzuzufügen, die zusammenklappen und Datenfelder gleichzeitig hinzufügen können? Wenn ja, wie haben Sie diesen Fehler nicht?

Thx

Antwort

1

jQuery Tables nicht unterstützt colspan und rowspan Attribute in tbody, das ist, warum Sie diesen Fehler erhalten.

Ich würde vorschlagen, Row details example zu betrachten, die alternative Möglichkeit bietet, zusätzliche Zeilendetails anzuzeigen.