DataTables CSS wird nicht auf Tabelle angewendet

Question

Die Tabelle verfügt über Seiten- und Sortierfunktionen über Databases, aber die CSS wird nicht angewendet. Ich benutze Schienen 4.2.

Ich habe alle meine CSS-und Image-Dateien in Vendor/Assets/Stylesheets bzw. Bilder geladen.

Ich verwende weniger für Stylesheets. ich importieren Sie die Datentabellen CSS in application.less

... 
@import "dataTables.bootstrap.css"; 
@import "jquery.dataTables.css"; 

Die Tabellendaten werden von Ajax und Datentabellen geladen auf Ajax-Erfolg initialisiert wird. Hier

LeaderBoards.prototype.updateResults = function() { 
    var valuesToSubmit = $(this.form).serialize(); 
    var that = this; 
    $.ajax({ 
     url: $(this.form).attr('action'), 
     type: "GET", 
     data: valuesToSubmit, 
     dataType: "html" 
    }).success(function(response){ 
     that.resultBox.html(response); 
     $('#leaderboard-table-test').DataTable({ 
      searching: false, 
      "iDisplayLength": 3, 
      "bLengthChange": false 
     }); 
    }).error(function(){ 
     var text = I18n.t('leaderboards.index.no_results_found'); 
     that.resultBox.html('<div class="no-results-found">'+ text +'</div>'); 
    }); 
}; 

ist ein Beispiel einer Tabelle, ich versuche:

<table id="table_id" class="display"> 
    <thead> 
    <tr> 
     <th>Column 1</th> 
     <th>Column 2</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <td>Row 1 Data 1</td> 
     <td>Row 1 Data 2</td> 
    </tr> 
    </tbody> 
</table> 

Ich kann Datentabellen Klassen sehen werden hinzugefügt, um diese, nachdem die Tabelle geladen wird. Zum Beispiel ist es in einem div gewickelt:

<div id="#table_id_wrapper" class="dataTables_wrapper form-inline dt-bootstrap no-footer"> 

Im application.css, ich sehe ist die @import Aussagen für meine Datentabellen CSS-Importe, aber die Datentabellen CSS selbst nicht enthalten.

Answer 1

Ich war in der Lage, das Problem herauszufinden. Die DataTables-CSS-Dateien wurden nicht ordnungsgemäß importiert, da vermutet. Der Trick bestand darin, sie zu zwingen, als weniger Dateien statt regulären CSS interpretiert zu werden.

Ich habe meine Importanweisung in @import (less) "jquery.dataTables.css"; geändert und es wurde ordnungsgemäß geladen.
Danke an Polyov für die Hilfe zu dieser Schlussfolgerung.