connet.lolipop.jp
はじめに
JspとServletを使い、超簡易な「Sqlite」データベースを作成しまし たのでご紹介したいと思います(備忘録)。
データベースは、設定が簡単な「SQLite」を、データ表示には「DataTable」を利用します。
なお、当サイトは、Java初心者様向けで上級者様は読みとばして下さい。
準備
●プラットフォーム
 OS-Windows

● Eclipse IDE
プログラミングには、Eclipse統合開発環境(IDE)のJava版で、「Tomcat」を搭載しているバージョンを使用します。
無償のオープンソースソフトウェアで「日本語版」は以下から配布されています。
Eclipse 日本語化 | MergeDoc Project

インストール先は、開発環境に適当な場所に保存して下さい。
「Eclipse」の操作説明は省略します。

● Sqliteデータベース
JavaでSQLiteを操作するには、SQLite-JDBCドライバーを用意すればOK。
ただこれだけです。

JDBCドライバーの配布サイトです。ライセンス条項をよく確認して下さい。
sqlite-jdbc

JDBCドライバーの保存場所は、ここでは、「Java」アプリケーションのフォルダの中に入れておきます。
「保存例」
c:/Program Files/Java/jre/lib/ext/sqlite-jdbc-3.30.1.jar
jreはjdk内にもありますが、公開用のjreのlib/extに保存します。
このjreの中の「ext」フォルダはjavaアプリケーションが起動すると最初に読み込まれる場所です。
最後にパスについて、もし通ってない場合は設定をして下さい。

● DataTablesの利用方法
1.CDN
ここでは、CDN経由で利用することにします。
      <head>
      <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4-4.1.1/jq-3.3.1/dt-1.10.18/sl-1.2.6/datatables.min.css"/>
      <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
      <script type="text/javascript" src="https://cdn.datatables.net/v/bs4-4.1.1/jq-3.3.1/dt-1.10.18/sl-1.2.6/datatables.min.js"></script></span>
      </head>
2.JS
DataTable読み込みのスクリプトで、body終了タグの直前あたりに書き込んで下さい。
lengthMenuは、1ページ当たりのレコード数を、プルダウンメニューに表示するオプション。
なくても構いません、この場合は最大10レコード表示。
DataTableのid名は、次項のtableのid名と同じ名前にします。
      <script type="text/javascript">
        $(document).ready( function () {	
          var table = $('#mytable').DataTable({  
            // レコードメニュー 
            "lengthMenu":[[5, 10, 25, 50, -1], [5, 10, 25, 50, "All"]],
            // ページの保存
            "stateSave":true
          });
        });	
      </script> 
      
3.HTML
DataTable利用の基本型です。
tableのcssは、class名を変更して自分好みにしてもかまいません。
tableのid名は、2項(JS)でDataTableに設定したid名と同じ名前にします。
      <table id="mytable" class="table table-striped table-bordered nowrap" width="100%">
        <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>
          <tr>
            <td>Row 2 Data 1</td>
            <td>Row 2 Data 2</td>
          </tr>
        </tbody>
      </table> 
      
ディレクトリ構成
「Eclipse IDE」を起動して、サブウィンドウのパッケージエクスプローラーに、図のよう な構成にディレクトリを作成します。
先頭の「SampleServlet」は新規に作成するプロジェクト名です。

1.新規プロジェクトの作成
 (1)メニュー -> ファイル -> 新規 -> 動的Webプロジェクト
 (2)プロジェクト名 -> SampleServletと入力
    ターゲット・ランタイム -> 新規ランタイムから選択 -> 完了

2.各パッケージとクラスの作成
 (1)作成したSampleServletプロジェクト上を右クリックして、新規ウィンドウから選択して作成します。
 (2)SampleDB.javaクラスは「クラス」を、その他のクラスについては「サーブレット」を選択。

3.JSPとCSSファイルの作成
 プロジェクト内のWebContet上を右クリックして、新規ウィンドウからJSPは「JSPファイル」を、CSSは「ファイル」を選択。

4.XMLファイルの作成
 プロジェクト内のWebContet/Web-INF上を右クリックして、新規ウィンドウで「その他」を選択 -> 「XML」フォルダ
 -> 「XMLファイル」を選択。

5.JDBCドライバ-の登録
 (1)作成したSampleServletプロジェクト上を右クリック -> ビルド・パス -> ビルド・パスの構成
 (2)ライブラリ-タブ -> 外部JARの追加 -> 前述で保存したJDBCドライバ-を指定 -> 適用
    -> 閉じる


 fileicon SampleServlet
   fileicon デプロイメント記述子:SampleServlet
   fileicon JAX WS Web サービス
   fileicon Java リソース
      fileicon src
        ⊞ sample.util
           fileicon SampleDB.java      
        ⊞ sample.view
           fileicon Delete.java
           fileicon Insert.java
           fileicon Insert2.java 	
           fileicon Search.java
           fileicon Search2.java
           fileicon Select.java
           fileicon Update.java
           fileicon Update2.java
      fileicon ライブラリー
         fileicon Apache Tomcat v9.0[Apache Tomcat v9.0]
         fileicon JRE システム・ライブラリー[jdk 1.8.0_161]				
         fileicon Web App ライブラリー
           fileicon sqlite-jdbc-3.30.1.jar-C:¥Program Files¥Java¥jre1.8.0_231¥jre¥lib¥ext
   fileicon JavaScriptリソース
    fileicon build
   fileicon WebContent
     fileicon META-INF
     fileicon WEB-INF
        fileicon web.xml
      fileicon index.jsp
      fileicon SampleServlet.css
Search
Google


↟ このページの先頭へ