首相データベースの作成・Webチャットシステムの作成

Webデザイン特別プログラム
データベース実習編4
首相データベースの作成
静岡理工科大学 総合情報学部
幸谷智紀
http://na-inet.jp/
本日の目標
• 首相データベース(名簿データベース)の作
成
– 見栄えの調整(HTML, CSSレベル)
– ユーザフレンドリーな機能の追加
– PHPスクリプトの整理・統合
• Twitterもどきシステムの作成
システムの全体図
PHPからSQL文を使ってMySQLを操作する例
• PHPスクリプトは
HTML内部に埋め
込んで作成する。
• mysql_connect関
数でMySQLに接
• mysql_close関数
で切断
• SQL文を実行する
のはこの間。
作成手順
1. prime_ministerフォルダを作成→index.htmlを作ってリ
ンクを順次追加していく。
2. template.phpを作成・・・「MySQLに接続→データベー
スを開く→接続を切る」だけのスクリプトを作り,きちん
と動作するかを確認
3. template.phpをコピーして下記の6つのスクリプトを順
に作成していく
1.
2.
3.
4.
5.
show_all.php・・・全件表示
insert.php・・・データの追加
delete_update.php・・・データの削除・更新を選択
delete_exec.php・・・データの削除実行
update_input.php・・・データの更新入力・実行
template.php(1/4)
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=UTF-8">
<title>首相データベース:テンプレート</title>
</head>
<body>
<h1>首相データベース:テンプレート</h1>
<hr>
template.php(2/4)
<?php
// データベース,テーブル名
$database = "prime_minister";
$table = "japanese";
// DBに接続
if(!$con = mysql_connect("localhost", "root", "")) {
echo "DB接続不可!¥n";
exit;
}
template.php(3/4)
// DB選択
if(!mysql_select_db($database, $con)) {
echo "DB選択エラー!¥n";
exit;
}
// ここから↓ この部分にSQL文を埋め込み,実行する
echo "OK!<br />¥n";
// ここまで↑
// DB切断
mysql_close($con);
?>
template.php(4/4)
<hr>
<a href="index.html">戻る</a>
</body>
</html>
• まずはこれを実行して”OK!”という表示が出る
ことを確認せよ!
show_all.php
// 全データ取得
$sql = "SELECT * FROM " . $table;
// SQL文確認
echo $sql . “<br />¥n”; ←確認不要時にはコメントにしておく
$result = mysql_query($sql);
while($data = mysql_fetch_array($result, MYSQL_ASSOC))
{
echo "id: " . $data['id'] . " name: " . $data['name'] . "
yomigana: " . $data['yomigana'] . "<br>¥n";
}
insert.php(1/2) SQL発行部分
if((isset($_POST['name'])) && (isset($_POST['yomigana'])))
{
$sql = "INSERT INTO " . $table . "(name, yomigana)
VALUES( '" . $_POST['name'] . "', '" . $_POST['yomigana'] .
"')";
if(!mysql_query($sql)){
echo "登録失敗!: " . $sql . "<br />¥n";
}
else {
echo "登録成功!: " . $sql . "<br />¥n";
}
}
insert.php (2/2) フォーム部分
// DB切断
mysql_close($con);
?>
<form method="POST">
名前: <input type="text" name="name" width="32"><br>
読みがな: <input type="text" name="yomigana"
width="64"><br>
<input type="submit" value="追加"> <input type="reset"
value="消去">
</form>
• PHPスクリプト部分とは独立に,静的HTMLとして作成
delete_update.phpのキモ
• 各データごとに「削除」(delete_exec.phpへ)か「更
新」(update_exec.phpへ)を選択させる。
• ユーザに見せる必要は無いが,delete_exec.php,
update_exec.phpに渡すべきデータは”hidden”タイ
プにして隠しておく。
echo '<td><form action="delete_exec.php"
method="POST"><input type="submit" value="
削除"><input type="hidden" name="id" value="' .
$data['id'] . '"></form></td>';
delete_exec.php
• DELETE文を発行するだけなので,自分で
SQL文を確認して作成してみよ!
update_exec.phpのキモ
• $_POST[‘update_exec’] == “on”の時のみ
更新(UPDATE文)を実行
• そうでなければ更新のためのフォームを表示
完成したら・・・
可能ならば次の工夫を追加してみること
1. 見栄えの調整・・・HTML, CSSの工夫
2. delete_exec.php, update_exec.phpは,削
除・更新前に「これでよろしいですか?」とい
う確認表示を入れる。
3. delete_exec.php, update_exec.phpの機
能を全てdelete_update.phpにまとめる。
次の課題
• Twitterもどき(Webチャット)システムを下記の
仕様で作れ
– データベース名:twitter
– テーブル名: sample
– フィールド数:3
• INT id
• VARCHAR(32) username
• TEXT(256) message
– PHPスクリプト・・・twitter.phpのみ
作成例
• この部分で,ユーザ名
(username)とメッセージ
(message)を入力・追加。
• この部分で既存のメッセ
ージをidの逆順で表示。
[SQL文]
SELECT * FROM テーブ
ル名 ORDER BY id
DESC