2017-11-20 9 views
1

私はdatatable.jsと組み合わせて単純なテーブルを使用しています。Datatableコンポーネントが正しく整列していません

私は6または7列を持っていれば問題ありません。検索と改ページは正しく整列されますが、3列または4列で3列に表示されます。 https://datatables.net/examples/basic_init/dom.html

これを適切に設定する方法を示しますが、私はthymeleafを使用し、私は私の質問を掲載している構文

UPDATE 1

文句だ: https://datatables.net/forums/discussion/45926/dom-in-thymeleaf-html-pages

これは投稿です

コードを追加しようとしました:thymeleafのhtmlページで

が、それは、このコード文句:

"dom": '<"top"i>rt<"bottom"flp><"clear">' 

私は 'で、「変更し、エスケープ文字を使用しようとしましたないが、ない方法。

このスクリプト私のhtmlページ、doesntの仕事に:

$(document).ready(function() { 
    $("#mensuales").DataTable({ 
     "dom": '<"top"i>rt<"bottom"flp><"clear">', 
     "language": { 
      "url": "//cdn.datatables.net/plug-ins/1.10.15/i18n/Spanish.json" 
     }, 
     "lenghtMenu": [ 
      [5, 12, 15, 20, -1], 
      [5, 12, 15, 20, "Todos"] 
     ], 
     "ordering": true, 
     stateSave: true 
    }); 
}); 

アランは、コードが正しいと言うが、私は私のページで使用することはできません。

UPDATE 2

enter image description here 任意の提案ですか?

おかげ

+0

: 'lenghtMenu' – isherwood

答えて

1

で試してみてください:あなたはタイプミスを持って

<script type="text/javascript" th:inline="javascript"> 
    /*<![CDATA[*/ 
    $(document).ready(function() { 
     $("#mensuales").DataTable({ 
     "dom": '<"top"i>rt<"bottom"flp><"clear">', 
     "language": { 
      "url": "//cdn.datatables.net/plug-ins/1.10.15/i18n/Spanish.json" 
     }, 
     "lenghtMenu": [ 
      [5, 12, 15, 20, -1], 
      [5, 12, 15, 20, "Todos"] 
     ], 
     "ordering": true, 
     stateSave: true 
     }); 
    }); 
    /*]]>*/ 
</script> 
関連する問題