5

Grails 2.4.4 アプリがあり、jQuery DataTableを活用する GSP を実装しようとしています。古い DataTable プラグインがあるようですが、メンテナンスされておらず、Grails 2.x と互換性がないようです。言うまでもなく、明示的にプラグインを必要とせずに、任意のJS ライブラリをGrailsに簡単に含める方法が必要です。

これが私のpluginsセクションです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"
}

この質問の範囲外の理由により、セクション内の既存の宣言を削除または変更することはできませんpluginsが、追加することはできます。「アセット パイプライン」と呼ばれるものは、JS ライブラリを Grails アプリに追加するための新しいクールな方法だと聞いたことがありますが、このパイプラインに関する資料はすべて曖昧で大まかなものです。そして、このパイプラインを使用して DataTables を Grails アプリに含める実際の具体的な例を見つけることができません。

Hello World!」バージョンの DataTable は次のようです。

<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();
} );

だから私は尋ねます:GSP内で実行されている(上記の)「Hello World」DataTableを取得するにはどうすればよいですか?これを機能させるには、どの特定の構成、プラグインなどを配線する必要がありますか?

4

1 に答える 1

1

DataTable js ファイルがこのディレクトリ web-app\js に保存されている場合、DataTable が必要なビューでこの Grails タグを使用できます。

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

同様に、必要なcssファイルをそのまま取得できます

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

必要なファイルがロードされたら、jQuery 関数を呼び出すことができます

<g:javascript>
    $(document).ready(function() {
        $('#example').DataTable();
    } );
</g:javascript>
于 2015-07-27T20:55:09.517 に答える