Q&A
前提・実現したいこと
dataTablesを使用しHTMLを作成しているのですが、日本語化をすることができません。
ご教授のほどお願い致します。
該当のソースコード
javascript
1window.addEventListener('DOMContentLoaded', event => { 2 // Simple-DataTables 3 // https://github.com/fiduswriter/Simple-DataTables/wiki 4 5 const datatablesSimple = document.getElementById('datatablesSimple'); 6 if (datatablesSimple) { 7 new simpleDatatables.DataTable(datatablesSimple); 8 } 9}); 10 11
html
1{% load static %} 2<!DOCTYPE html> 3<html lang="ja"> 4 <head> 5 <meta charset="utf-8" /> 6 <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 7 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" /> 8 <meta name="description" content="" /> 9 <meta name="author" content="" /> 10 <title>Reward Management</title> 11 <link href="https://cdn.jsdelivr.net/npm/simple-datatables@latest/dist/style.css" rel="stylesheet" /> 12 <link href="{% static 'styles.css' %}" rel="stylesheet" /> 13 <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/js/all.min.js" crossorigin="anonymous"></script> 14 </head> 15 <body class="sb-nav-fixed"> 16 17 <main> 18 <div class="card-body"> 19 <table id="datatablesSimple"> 20 <tbody> 21 <tr> 22 <td>data1</td> 23 <td>data2</td> 24 <td>data3</td> 25 <td>data4</td> 26 </tr> 27 </tbody> 28 </table> 29 </div> 30 </main> 31 </div> 32 </div> 33 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script> 34 <script src="{% static 'scripts.js' %}"></script> 35 <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.js" crossorigin="anonymous"></script> 36 <script src="https://cdn.jsdelivr.net/npm/simple-datatables@latest" crossorigin="anonymous"></script> 37 <script src="{% static 'datatables-simple-demo.js' %}"></script> 38 <script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script> 39 </body> 40</html> 41 42}); 43 44
試したこと
html
1<script src="https://cdn.datatables.net/1.10.21/js/dataTables.bootstrap4.min.js"></script> 2<script> 3 $(function () { 4 // datatableの設定を変更 5 $("#datatablesSimple").DataTable({ 6 "language": { 7 "url": "https://cdn.datatables.net/plug-ins/1.10.16/i18n/Japanese.json" 8 } 9 }); 10 }) 11</script>
補足情報(FW/ツールのバージョンなど)
python
django
bootstrap
回答1件
あなたの回答
tips
プレビュー
下記のような回答は推奨されていません。
このような回答には修正を依頼しましょう。