ベストアンサー

webページの一部のみの更新について

2009/09/28 00:37

JavaScript初心者です。 PHPとXHTMLでHPを作成中ですが、タイトルにあるようにHPの一部のみ更新することが可能でしょうか？ JavaScriptで不可能な場合はどの言語で出来ますか? やりたいことはセレクトで選択したらobjectで表示中のページのみ変更する事です。分からないなりに作ってみたサンプルの結果がこれです。 index.php ------------------------ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>サンプル</title> </head> <body> <div> <div> <form action="aaa.php" method="post"> <select name="category" id="category" onchange="submit();"> <option value="0">A</option> <option value="1">B</option> <option value="2">C</option> <option value="3">D</option> ・・・ <option value="25">Z</option> </select> </form> <object data='test.php?category='<?=$_POST['category']?> height="50" width="200" ></object> </div> ここに別要素の表示<br /> 出来れば更新したくない。 <div> </div> </body> </html> ------------------------ test.php ------------------------ <html> <body> <?php if($_POST['category']==0){ $a='AAA'; }elseif($_POST['category']==1){ $a='BBB'; }elseif($_POST['category']==2){ $a='CCC'; }elseif($_POST['category']==3){ $a='ddd'; }elseif($_POST['category']==25){ $a='ZZZ'; } print $a.'が選択されました。'; ?> </body> </html> ------------------------ これだとtest.phpにパラメータが送れませんし、セレクトで選択しても更新がかかって初期のAに戻ってしまいます。かといって<form action="test.php" method="post">にするとtest.phpへ飛んでしまいます。出来れば詳しいサンプルコードを教えていただけるとありがたいです。

dgahr1594
お礼率44% (22/50)

JavaScript
回答数3
ありがとう数2

みんなの回答 （3）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

yyr446
ベストアンサー率65% (870/1330)

2009/09/28 16:29 回答No.2

全部phpで処理しているなら、別要素を表示するphpをaaa.phpとして、test.phpと同じく下のように作っておいて＜aaa.php＞ ------------------------ <html> <body> <?php if($_GET['category']==0){ $a='aaa'; }elseif($_GET['category']==1){ $a='bbb'; }elseif($_GET['category']==2){ $a='CCC'; }elseif($_GET['category']==3){ $a='ddd'; }elseif($_GET['category']==25){ $a='ZZZ'; } print(file_get_contents($a . ".htm")); ?> </body> </html> ------------------------ これを呼び出す別の<object>をindex.phpで出力すればよい＜index.php＞ ------------------------ <body> <div> <div> <?php $selected["category"][$_POST["category"]]=" selected"; print <<<eof1 <form method="post" action="{$_SERVER["PHP_SELF"]}"> <select name="category" id="category" onchange="this.form.submit();"> <option value="0"{$selected["category"]["0"]}>A</option> <option value="1"{$selected["category"]["1"]}>B</option> <option value="2"{$selected["category"]["2"]}>C</option> <option value="3"{$selected["category"]["3"]}>D</option> </select> </form> <object data="test.php?category={$_POST['category']}" height="50" width="200" ></object> eof1; ?> </div> ここに別要素の表示<br /> <?php print <<<eof2 <object data="aaa.php?category={$_POST['category']}" height="480" width="600" ></object> eof2; ?> </div> </body> ------------------------ test.php ------------------------ <html> <body> <?php if($_POST['category']==0){ $a='AAA'; }elseif($_POST['category']==1){ $a='BBB'; }elseif($_POST['category']==2){ $a='CCC'; }elseif($_POST['category']==3){ $a='ddd'; }elseif($_POST['category']==25){ $a='ZZZ'; } print $a.'が選択されました。'; ?> </body> </html> ------------------------

質問者

お礼 2009/09/28 23:47

yyr446さん回答ありがとうございます。質問した私が間違っていました。 <form action="aaa.php" method="post">とありますが「aaa.php」ではなく「index.php」の間違いでした。 aaa.phpで作っていてindex.phpに修正して掲載するはずがそのまま掲載してしまいました。おバカなことしてすみませんm(_ _)m ですが、yyr446さんの回答をヒントにaaa.phpのワンクッションを入れずにtest.phpを直接表示させることが出来ました。ありがとうございました。

ログインすると、全ての回答が全文表示されます。

その他の回答 (2)

神崎渉瑠（@taloo）
ベストアンサー率44% (1016/2280)

2009/09/28 18:20 回答No.3

インラインフレームはダメですか？（一部端折り＆改造） index.php <form action="aaa.php" target="betsu" method="post"> <select name="category" id="category" onchange="submit();"> <option value="0">A</option> <option value="1">B</option> <option value="2">C</option> </select> </form> <iframe src="about:blank" name="betsu"></iframe> ------------- aaa.php <html> <body> <?php var $pages=['AAA','BBB','CCC']; var $page=$pages[$_POST['category']]||'blank'; print $page.'が選択されました。'; ?> </body> </html>

質問者

補足 2009/09/28 23:09

回答ありがとうございます。 XHTMLの厳密形を使用すると「インラインフレームは非推奨となるのでオブジェクトで代用」という記事を見たのでインラインフレームを使用していません。この方法はオブジェクトでは出来ないのですか? と言ってもXHTMLの厳密形である理由は「どうせ勉強するなら今後主流になる？という記事を見たので厳密形をやろう」と言うくらいなので、特にこだわりはありません。いまさらながらXHTMLの厳密形は良くないのでしょうか？

ログインすると、全ての回答が全文表示されます。

yambejp
ベストアンサー率51% (3827/7415)

2009/09/28 01:56 回答No.1

そういうのはajaxでやるのが妥当でしょう。また、＞セレクトで選択しても更新がかかって初期のAに戻ってしまいます。だけが問題なら、戻らないずパラメータを引き継ぐように <? $selected["category"][$_POST["category"]]=" selected"; print <<<eof <form method="post"> <select name="category" id="category" onchange="this.form.submit();"> <option value="0"{$selected["category"]["0"]}>A</option> <option value="1"{$selected["category"]["1"]}>B</option> <option value="2"{$selected["category"]["2"]}>C</option> <option value="3"{$selected["category"]["3"]}>D</option> </select> </form> eof; ?> のような書き方でもよいと思います

ログインすると、全ての回答が全文表示されます。