php講習 1/13
・今日も掃除は東浜でした。
・今日も掃除は東浜でした。
・今日は、内容が多いのと、ソースが混じっているので間違いが多いと思います。
また、番号も正しく番号順に並んでいないところもあります。
おかしいところは、気が向いたらあとで修正します。
＜１時間目＞
・準備は、昨日と同じ
eclipse,zampp,mySQLクライアントの起動
課題テキストPDFを開く
機能追加部分のテキスト修正確認用に「さくら」も
アップロード用jpg画像
・昨日は、画像のアップロードが出来るところまで
昨日お休みした人が必要な作業
commentテーブルのカラム追加（url,photo）
phpプログラムの更新
・掲示板の拡張、続き
<submit.php>
$sql =" update comment set photo ='".$row[0].".jpg'
WHERE id = ".$row[0];
mysql_query($sql);
WHERE id = ".$row[0];
mysql_query($sql);
SQL文のファイルIDに余分な空白が入っていると、あとでjpgファイルを呼び出すとき
見つからないので、余分な空白は取り除く。
・変更後の確認作業、photoカラムにファイル名が設定されていることを確認する
select * from comment;
select * from comment order by id desc limit 1\G
＜２時間目＞
・jpg画像表示
<index.php>
print '<img src="./img/' . $row1['photo'] . '" alt="' . $row1['photo'].'" width=150>' ;
・画面にjpg画像が表示されればOK。
・画像を２つ表示させてみよう。
1.commentテーブルにphoto2というカラムの追加を行う
2.プロジェクト直下にimg2というディレクトを作成する
3.index.phpに2個目の画像の入力フォーム追加を行う
4.submit.phpに画像の受け取りとリネームを行う処理の追加を行う
5.commentテーブルにphoto2の更新の処理を追加する
6.index.phpに2個目の画像の表示を追加する。
<作業>
1.commentテーブルにphoto2というカラムの追加を行う
ALTER TABLE comment ADD photo2 TEXT AFTER photo ;
・カラムの追加を確認
desc comment ;
2.プロジェクト直下にimg2というディレクトを作成する
ALTER TABLE comment ADD photo2 TEXT AFTER photo ;
・カラムの追加を確認
desc comment ;
2.プロジェクト直下にimg2というディレクトを作成する
eclipseからフォルダ追加
・windowsのエクスプローラからフォルダを確認するC:\pleiades\xampp\htdocs\bbs\img2
3.index.phpに2個目の画像の入力フォーム追加を行う
PHOTO2<br>
<input type="file" name="photo2" id="photo2" /><br />
・確認
画面上でアップロードファイルパスが表示されることを確認する
4.submit.phpに画像の受け取りとリネームを行う処理の追加を行う
// 画像データ2を保存する。
if (is_uploaded_file($_FILES['photo2']['tmp_name'])){
move_uploaded_file($_FILES['photo2']['tmp_name'], "./img2/".$row[0].".jpg");
}
・確認
投稿して、ファイルをアップロードする
img2フォルダにファイルがアップロードされていることを確認する
(imgとimg2のファイルIDが同じになっているが、内容は異なる)
5.commentテーブルにphoto2の更新の処理を追加する
# 画像データのファイルIDをDBに更新する
$sql =" update comment set photo2 ='".$row[0].".jpg'
WHERE id = ".$row[0];
mysql_query($sql) or die(mysql_error());
・確認
投稿して、ファイルをアップロードする
結果がDB上更新されていることを確認する
6.index.phpに2個目の画像の表示を追加する。
print "<br />" ;
print '<img src="./img2/' . $row1['photo2'] . '" alt="' . $row1['photo2'].'" width=150><br />' ;
・確認
投稿して、画像2が表示されることを確認する
＜３時間目＞
7.画像が登録されているときだけ表示を行う処理を入れる。
（現在は画像が登録されていない場合でもimgタグが表示されています）
8.URLが入力されているときだけリンクに表示処理を行うようにする。
（現在はURLが登録されていない場合でもimgタグが表示されています）
ヒント：エラーチェックを行っている仕組みとほぼ同じです。要応用。
9.返信関連の機能にも画像投稿が出来るようにして見ましょう。
10. ７と８の項目も次いでに実装して見ましょう。
（reply.php, reply_submit.php, index.phpに画像の処理を追加する）
7.画像が登録されているときだけ表示を行う処理を入れる。
（現在は画像が登録されていない場合でもimgタグが表示されています）
if (($row1['photo']=="") or ($row1['photo']==null)) {
} else {
print "<p>" ;
print '<img src="./img/' . $row1['photo'] . '" alt="' . $row1['photo'].'" width=150><br />' ;
print "</p>" ;
}
print "<p>" ;
print '<img src="./img/' . $row1['photo'] . '" alt="' . $row1['photo'].'" width=150><br />' ;
print "</p>" ;
}
・確認方法
HTMLソースを見て、<img>タグがないことを確認する。
8.URLが入力されているときだけリンクに表示処理を行うようにする。
（現在はURLが登録されていない場合でもimgタグが表示されています）
if (($row1['url']=="") or ($row1['url']==null)) {
print $row1['nickname']."さんの投稿<br />";
} else {
print '<a href="'.$row1["url"].'">'.$row1['nickname']."</a>さんの投稿<br />";
print $row1['nickname']."さんの投稿<br />";
} else {
print '<a href="'.$row1["url"].'">'.$row1['nickname']."</a>さんの投稿<br />";
}
・確認方法
HTMLソースを見て、<a href="">タグがないことを確認する。
9.返信関連の機能にも画像投稿が出来るようにして見ましょう。
1.replyテーブルにphotoというカラムの追加を行う
2.プロジェクト直下にimg3というディレクトを作成する
3.reply.phpに画像の入力フォーム追加を行う
4.submit.phpに画像の受け取りとリネームを行う処理の追加を行う
5.replyテーブルにphotoの更新の処理を追加する
6.index.phpに画像の表示を追加する。
2.プロジェクト直下にimg3というディレクトを作成する
3.reply.phpに画像の入力フォーム追加を行う
4.submit.phpに画像の受け取りとリネームを行う処理の追加を行う
5.replyテーブルにphotoの更新の処理を追加する
6.index.phpに画像の表示を追加する。
10.7と8の項目もついでに実装してみましょう。
9.返信関連の機能にも画像投稿が出来るようにして見ましょう。
・返信関連対象
（reply.php, reply_submit.php, index.phpに画像の処理を追加する）
・処理
1.replyテーブルにphotoというカラムの追加を行う
2.プロジェクト直下にimg3というディレクトを作成する
3.reply.phpに画像の入力フォーム追加を行う
4.submit.phpに画像の受け取りとリネームを行う処理の追加を行う
5.replyテーブルにphotoの更新の処理を追加する
6.index.phpに画像の表示を追加する。
・photo2の（１）-（６）を説明。
・引き続き（７）（８）の機能を追加する。
＜４時間目＞
・（７）（８）の機能を追加した処理の解説
・引き続き（９）（１０）の機能を追加する。
1.replyテーブルにphotoというカラムの追加を行う
ALTER TABLE reply ADD photo TEXT AFTER url ;
・カラムの追加を確認
desc comment ;
2.プロジェクト直下にimg3というディレクトを作成する
eclipseからフォルダ追加
・windowsのエクスプローラからフォルダを確認する
C:\pleiades\xampp\htdocs\bbs\img3
3.reply.phpに画像の入力フォーム追加を行う
PHOTO<br>
<input type="file" name="photo" id="photo" /><br />
・確認
画面上でアップロードファイルパスが表示されることを確認する
・
<form action="submit.php" method="post" enctype='multipart/form-data'> 内容<br>
<form action="reply_submit.php" method="post" enctype='multipart/form-data'>
4.reply_submit.phpに画像の受け取りとリネームを行う処理の追加を行う
// 最後に入れたID を取得する
$sql = "select id from reply order by id desc limit 1";
$result = mysql_query($sql);
$row = mysql_fetch_row($result);
// 画像データ2を保存する。
if (is_uploaded_file($_FILES['photo']['tmp_name'])){
move_uploaded_file($_FILES['photo']['tmp_name'], "./img3/".$row[0].".jpg");
}
・確認
投稿して、ファイルをアップロードする
img3フォルダにファイルがアップロードされていることを確認する
5.replyテーブルにphotoの更新の処理を追加する
# 画像データのファイルIDをDBに更新する
$sql =" update reply set photo ='".$row[0].".jpg'
WHERE id = ".$row[0];
mysql_query($sql) or die(mysql_error());
・確認
投稿して、ファイルをアップロードする
結果がDB上更新されていることを確認する
6.index.phpに画像の表示を追加する。
if (($row2['photo']==null) or ($row2['photo']==null)) {
} else {
print "<br />" ;
print '<img src="./img3/' . $row2['photo'] . '" alt="' . $row2['photo'].'" width=150><br />' ;
}
・確認
投稿して、画像が表示されることを確認する
ALTER TABLE reply ADD photo TEXT AFTER url ;
・カラムの追加を確認
desc comment ;
2.プロジェクト直下にimg3というディレクトを作成する
eclipseからフォルダ追加
・windowsのエクスプローラからフォルダを確認する
C:\pleiades\xampp\htdocs\bbs\img3
3.reply.phpに画像の入力フォーム追加を行う
PHOTO<br>
<input type="file" name="photo" id="photo" /><br />
・確認
画面上でアップロードファイルパスが表示されることを確認する
・
<form action="submit.php" method="post" enctype='multipart/form-data'> 内容<br>
<form action="reply_submit.php" method="post" enctype='multipart/form-data'>
4.reply_submit.phpに画像の受け取りとリネームを行う処理の追加を行う
// 最後に入れたID を取得する
$sql = "select id from reply order by id desc limit 1";
$result = mysql_query($sql);
$row = mysql_fetch_row($result);
// 画像データ2を保存する。
if (is_uploaded_file($_FILES['photo']['tmp_name'])){
move_uploaded_file($_FILES['photo']['tmp_name'], "./img3/".$row[0].".jpg");
}
・確認
投稿して、ファイルをアップロードする
img3フォルダにファイルがアップロードされていることを確認する
5.replyテーブルにphotoの更新の処理を追加する
# 画像データのファイルIDをDBに更新する
$sql =" update reply set photo ='".$row[0].".jpg'
WHERE id = ".$row[0];
mysql_query($sql) or die(mysql_error());
・確認
投稿して、ファイルをアップロードする
結果がDB上更新されていることを確認する
6.index.phpに画像の表示を追加する。
if (($row2['photo']==null) or ($row2['photo']==null)) {
} else {
print "<br />" ;
print '<img src="./img3/' . $row2['photo'] . '" alt="' . $row2['photo'].'" width=150><br />' ;
}
・確認
投稿して、画像が表示されることを確認する
10.7と8の項目もついでに実装してみましょう。
返信に対してurlとpicファイルのチェックを追加する。
<index.php>
7.（返信で）画像が登録されているときだけ表示を行う処理を入れる。
返信に対してurlとpicファイルのチェックを追加する。
<index.php>
7.（返信で）画像が登録されているときだけ表示を行う処理を入れる。
（現在は画像が登録されていない場合でもimgタグが表示されています）
if (($row2['photo']=="") or ($row2['photo']==null)) {
} else {
print "<p>" ;
print '<img src="./img/' . $row2['photo'] . '" alt="' . $row2['photo'].'" width=150><br />' ;
print "</p>" ;
}
・確認方法
HTMLソースを見て、<img>タグがないことを確認する。
if (($row2['photo']=="") or ($row2['photo']==null)) {
} else {
print "<p>" ;
print '<img src="./img/' . $row2['photo'] . '" alt="' . $row2['photo'].'" width=150><br />' ;
print "</p>" ;
}
・確認方法
HTMLソースを見て、<img>タグがないことを確認する。
<index.php>
8.（返信で）URLが入力されているときだけリンクに表示処理を行うようにする。
（現在はURLが登録されていない場合でもimgタグが表示されています）
if (($row2['url']=="") or ($row2['url']==null)) {
print $row2['nickname']."さんの返信<br />";
} else {
print '<a href="'.$row2["url"].'">'.$row2['nickname']."</a>さんの返信<br />";
}
・確認方法
HTMLソースを見て、<a href="">タグがないことを確認する。
8.（返信で）URLが入力されているときだけリンクに表示処理を行うようにする。
（現在はURLが登録されていない場合でもimgタグが表示されています）
if (($row2['url']=="") or ($row2['url']==null)) {
print $row2['nickname']."さんの返信<br />";
} else {
print '<a href="'.$row2["url"].'">'.$row2['nickname']."</a>さんの返信<br />";
}
・確認方法
HTMLソースを見て、<a href="">タグがないことを確認する。
＜５時間目＞
・引き続き（９）（１０）の機能を追加する。
・（９）（１０）の機能を追加した処理の解説
・htmlのソースをみるときたないので、明日整理します。
また、htmlとphpが交じり合っているので、綺麗にする方法を話します。
・本日の作業項目は、メールで送ります。
・作業項目は多いですが、項目のひとつひとつは簡単なものなので、
疑問点があれば整理しておいてください。
・明日の予定（１-２時間）
デバックの方法について(ポイント)説明
掲示板の再構成
0 件のコメント:
コメントを投稿