【JQuery】PythonサーバーでMySQLに接続して DataTable にデータを表示する

Javascript, Python, 開発

おはようございます。

DataTablesを試しているのですが、
せっかくなのでデータベースから取得したデータを表示してみようかと思います。
手っ取り早く Python + MySQL で実装します。

プロジェクトは新規で作成しますが、
PythonやMySQLについては過去記事を参考にしていただければ。

スポンサーリンク

新規プロジェクトの作成

新たにサンプル用プロジェクトを作成します。

PyCharmを起動し、上部メニューの「File」>「New Project」を選択し、
ウィザードに沿ってプロジェクトを新規作成します。

フォルダ構成は次の通りとします。

DataTableSample
│ Main.py

└─templates
Main.html

パッケージのインストール

Tornado、MySQL接続用のパッケージをインストールします。

DefaultSettingsメニュー
DefaultSettingsメニュー

「File」>「Default Settings…」メニューを選択します。

パッケージの追加
パッケージの追加

プロジェクトを選択し、右側にある「+」ボタンをクリックします。

tornado のインストール

検索欄に「tornado」と入力、表示されたパッケージを選択し、「Install Package」ボタンをクリックします。

mysql用パッケージのインストール
mysql用パッケージのインストール

先ほどと同様、「mysql-connector-python-rf」パッケージをインストールします。

以上で事前準備は完了です。

画面の作成

前回、単純にHTMLで作成したものを流用します。

Main.html

べた書きしていたテーブルの内容を削除し、
ページ表示時に、サーバーからデータを取得するように javascript の部分を変更しています。

プログラム

Main.py

MySQLからデータを取得して、JSON形式で返却するようにしています。

若干はまったのが、
JSONの形式で、「data」のキーに表示するデータのリストを設定しないと表示ができなかったところですかね。
そのほかのキーについてはちょっと検証していません。

起動してみる

起動後画面
起動後画面

無事にデータが表示されました。

まとめ

サーバー側との通信もJSONで行えるので便利ですね。
(最近そんなのばかりですが)

気が向いたら、検索やデータ追加、更新なんかもやってみようかと思います。

ではでは。

 

スポンサーリンク


関連するコンテンツ