So importieren Sie jQuery DataTables in Grails 2.4.4

Question

Ich habe eine Grails 2.4.4 App und versuche, ein GSP zu implementieren, das eine jQuery DataTable nutzt. Ich sehe, es gibt eine alteDataTable plugin aber es sieht nicht gepflegt und inkompatibel mit Grails 2.x. Nicht zu erwähnen, dort sollte eine Möglichkeit sein, einfach any JS lib in Grails zu enthalten, ohne explizit ein Plugin dafür zu verlangen.

Hier ist der plugins Abschnitt meines BuildConfig:

plugins { 
    build ":release:3.0.1" 
    build ":tomcat:7.0.52.1" 

    compile "org.grails.plugins:gson:1.1.4" 
    compile ":rest-client-builder:1.0.3" 
    compile ":yammer-metrics:3.0.1-2" 

    runtime ":jquery:1.11.1" 
    runtime ":cached-resources:1.0" 
    runtime ":resources:1.2.14" 
    compile ":cache-headers:1.1.7" 

    compile ":rest-client-builder:1.0.3" 
    compile ":export:1.6" 
    compile ":standalone:1.2.3" 
    compile ":cache-headers:1.1.7" 
    compile ":scaffolding:2.1.2" 
    compile ':cache:1.1.3' 

    runtime ":resources:1.2.14" 
    runtime ":hibernate:3.6.10.15" 
    runtime ":database-migration:1.4.0" 
    runtime ":jquery:1.11.1" 
} 

Aus Gründen nicht in den Anwendungsbereich dieser quesiton, ich kann nicht entfernen oder alle vorhandenen Erklärungen im plugins Abschnitt ändern, aber ich kann hinzufügen Sie. Ich habe gehört, dass etwas, das "Assets-Pipeline" genannt wird, der neue coole Weg ist, JS-Bibliotheken in eine Grails-App zu integrieren, aber die gesamte Literatur, die ich in dieser Pipeline finden kann, ist vage und hochrangig. Und ich kann keine konkreten konkreten Beispiele finden, wie diese Pipeline verwendet wird, um DataTables in eine Grails-App aufzunehmen.

Die „! Hallo Welt“ Version einer Datatable scheint dies zu sein:

<table id="example" class="display" cellspacing="0" width="100%"> 
    <thead> 
     <tr> 
      <th>Name</th> 
      <th>Position</th> 
      <th>Office</th> 
     </tr> 
    </thead> 

    <tbody> 
     <tr> 
      <td>Tiger Nixon</td> 
      <td>System Architect</td> 
      <td>Edinburgh</td> 
     </tr> 

     ...lots of more rows 
    </tbody> 
</table> 

$(document).ready(function() { 
    $('#example').DataTable(); 
}); 

Also frage ich: Wie gehe ich das (oben) erhalten „Hallo Welt“ Datatable Lauf in einem GSP ? Was spezifische Konfigs, Plugins, etc. muss ich verdrahten, damit dies funktioniert?

Answer 1

Wenn Ihre DataTable-JS-Dateien in diesem Verzeichnis web-app \ js gespeichert sind, können Sie dieses Grails-Tag in Ihrer Ansicht verwenden, wenn Sie eine DataTable benötigen.

<g:javascript src="jquery.datatables.min.js" /> 

Ähnlich Sie Ihre erforderlichen CSS-Datei als solche

<g:external dir="css" file="jquery.datatables.css" /> 

, sobald diese die erforderlichen Dateien geladen werden, erhalten können, können Sie die Funktion jQuery nennen

<g:javascript> 
    $(document).ready(function() { 
     $('#example').DataTable(); 
    }); 
</g:javascript>