パス1
php を実行し、html を作成する
パス2
できたhtml を実行するです。
です。
前回作成したphp は、その前のソースと同じhtml をphp に作成させてるだけになります。
そこで、起動時にオプション？(引数)を付けて起動を制御したいと思います。
制御引数をmodeとします。
作成するにあたってルールを決めます。
mode指定無し
新規作成
mode=1
保存
mode=2
再読みこみ
mode=3
コミックタイトル追加
これで作成します。
引数の渡し方は、起動時に?mode=1 で設定できますが、formタグでプログラム的にわたせます。
それは、formタグの中にinputタグを使うと引数となり、form タグは、指定したプログラムを引数を付けて起動します。
そこで、ソースを以下に修正します。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>新規作者編集</title>
<script>
function setMode(mode){
document.getElementById("mode").value = mode;
}
</script>
</head>
<body>
<div>新規作者編集</div>
<br>
<?php
print "<form method=\"POST\" action=\"newautho.php\" name=\"main_form\">";
print "<div>";
print "<div style=\"border: solid 1px #202020;margin: 5px 5px 3px;\">";
print "<div style=\"border: solid 0px #202020;margin: 5px 5px 5px 5px;\">";
print "<input id=\"mode\" type=\"hidden\" name=\"mode\" />";
print "著者名：<input id=\"name\" type=\"text\" name=\"name\" size=\"50\" /><br>";
print " 読み：<input id=\"yomi\" type=\"text\" name=\"yomi\" size=\"50\" /><br>";
print "ファイル名：<br>";
print "<input id=\"path_dir\" type=\"text\" name=\"path_dir\" size=\"50\" /><br>";
print "追記事項:<br>";
print "<textarea id=\"info\" name=\"info\" rows=\"4\" cols=\"50\"></textarea><br>";
print "</div>";
print "<input id=\"renewal\" type=\"submit\" name=\"renewal\" onclick=\"setMode(1);\" value= \"保存\" />";
print "<input id=\"renewal\" type=\"submit\" name=\"renewal\" onclick=\"setMode(2);\" value= \"再読み込み\" />";
print "</div>";
print "</div>";
print "<div style=\"border: solid 1px #202020;margin: 5px 5px 3px;\">";
print "作品リスト<br>";
print "<div style=\"border: solid 1px #202020;margin: 5px 5px 5px 5px;\">";
print "<div style=\"border: solid 0px #202020;margin: 5px 5px 5px 5px;\">";
print "タイトル<input id=\"title\" type=\"text\" name=\"title\" size=\"50\" /><br>";
print "リンク<input id=\"dir_link\" type=\"text\" name=\"dir_link\" size=\"50\" /><input id=\"Search\" type=\"button\" name=\"Search\" value= \"検索\" /><br>";
print "出版社<input id=\"Publishing_company\" type=\"text\" name=\"Publishing_company\" size=\"50\" /><br>";
print "雑誌名<input id=\"Journal_title\" type=\"text\" name=\"Journal_title\" size=\"50\" /><br>";
print "コメント<br>";
print "<textarea id=\"Comment\" name=\"Comment\" rows=\"4\" cols=\"50\"></textarea><br>";
print "</div>";
print "</div>";
print "<input id=\"add\" type=\"submit\" name=\"add\" onclick=\"setMode(3);\" value= \"追加\" />";
print "</div>";
print "</div>";
print "</form>";
?>
</body>
</html>
結構修正しました。<html>
<head>
<meta charset="UTF-8" />
<title>新規作者編集</title>
<script>
function setMode(mode){
document.getElementById("mode").value = mode;
}
</script>
</head>
<body>
<div>新規作者編集</div>
<br>
<?php
print "<form method=\"POST\" action=\"newautho.php\" name=\"main_form\">";
print "<div>";
print "<div style=\"border: solid 1px #202020;margin: 5px 5px 3px;\">";
print "<div style=\"border: solid 0px #202020;margin: 5px 5px 5px 5px;\">";
print "<input id=\"mode\" type=\"hidden\" name=\"mode\" />";
print "著者名：<input id=\"name\" type=\"text\" name=\"name\" size=\"50\" /><br>";
print " 読み：<input id=\"yomi\" type=\"text\" name=\"yomi\" size=\"50\" /><br>";
print "ファイル名：<br>";
print "<input id=\"path_dir\" type=\"text\" name=\"path_dir\" size=\"50\" /><br>";
print "追記事項:<br>";
print "<textarea id=\"info\" name=\"info\" rows=\"4\" cols=\"50\"></textarea><br>";
print "</div>";
print "<input id=\"renewal\" type=\"submit\" name=\"renewal\" onclick=\"setMode(1);\" value= \"保存\" />";
print "<input id=\"renewal\" type=\"submit\" name=\"renewal\" onclick=\"setMode(2);\" value= \"再読み込み\" />";
print "</div>";
print "</div>";
print "<div style=\"border: solid 1px #202020;margin: 5px 5px 3px;\">";
print "作品リスト<br>";
print "<div style=\"border: solid 1px #202020;margin: 5px 5px 5px 5px;\">";
print "<div style=\"border: solid 0px #202020;margin: 5px 5px 5px 5px;\">";
print "タイトル<input id=\"title\" type=\"text\" name=\"title\" size=\"50\" /><br>";
print "リンク<input id=\"dir_link\" type=\"text\" name=\"dir_link\" size=\"50\" /><input id=\"Search\" type=\"button\" name=\"Search\" value= \"検索\" /><br>";
print "出版社<input id=\"Publishing_company\" type=\"text\" name=\"Publishing_company\" size=\"50\" /><br>";
print "雑誌名<input id=\"Journal_title\" type=\"text\" name=\"Journal_title\" size=\"50\" /><br>";
print "コメント<br>";
print "<textarea id=\"Comment\" name=\"Comment\" rows=\"4\" cols=\"50\"></textarea><br>";
print "</div>";
print "</div>";
print "<input id=\"add\" type=\"submit\" name=\"add\" onclick=\"setMode(3);\" value= \"追加\" />";
print "</div>";
print "</div>";
print "</form>";
?>
</body>
</html>
<script>
function setMode(mode){
document.getElementById("mode").value = mode;
}
</script>
これは、javascript の関数を作りました。
id がmode の値を引数で与えられた値に設定します。
今回のmode の設定用処理です。
print "<form method=\"POST\" action=\"newautho.php\" name=\"main_form\">";
formの設定をします。実行形態は、POST で、実行時にnewautho.phpを起動します。
print "<input id=\"mode\" type=\"hidden\" name=\"mode\" />";
引数パラメーターにmode を追加しました。
javascript の関数は、ここの値を設定します。
hidden は、画面表示されない隠しパラメーターを示します。
<textarea id=\"info\" name=\"info\" rows=\"4\" cols=\"50\"></textarea>
前回までは、input でしたが、文字列入力に変更しました。
print "<input id=\"renewal\" type=\"submit\" name=\"renewal\" onclick=\"setMode(1);\" value= \"保存\" />";
button をsubmit に変更しました。これは、ボタンを押すとform を実行します。
onclick="setMode(1);" は、ボタンを押されたら、関数を実行しなさい！って命令をかきました。
このボタンを押したら、mode =1 となる設定です。
※同じ修正の説明は、記載しません。
print "</form>";
ここまでがform です。の記載です。
これで、ボタンを押すたびにmode を変更して、newautho.phpを起動します。
実行してボタンを押しても画面がチラつくだけで違いが解らないですよね！
次回は、違いをわかるようにします。
0 件のコメント:
コメントを投稿