CGI（Perl）とHTMLについて

質問

CGI初心者です、Perlの知識は皆無です。
質問は２つあるのですが・・・

１、CGIのページを例えば画像を呼び出すようにHTMLで指定できるのでしょうか？
画像であれば<img src=".../AAA.gif">ですが、こんな感じでCGIのページ自体をHTMLの指定した枠に呼び出すことはできるのでしょうか。

２、CGIページのカスタマイズ
現在、CGIレスキューさんからダウンロードしたファイルをカスタマイズしています。
条件指定ができる検索データベースです。
設置と動作確認はできたのですが、思うようにレイアウトできないでいます。
Perl記述中にテーブル（HTML）を挿入すると、プルダウンメニューから選択項目が飛び出してしまうのです。

（おおざっぱに記述すると）
print <<"---HTML---";

あいうえお<select name="aiueo" size=1>
---HTML---

forseach $i (@AIUEOs) { print "<option value=\$i\"$pref_selected{$i}>$i</option>\n";}

print <<"---HTML---";
</select>
<p>
（略）
---HTML---
こんな感じです、変数の部分は変えてます。

ずっと上の方で、
@AIUEOs = ("あああ", "いいい", "ううう", "えええ", "おおお");
と、変数が定義されてるようです。

名称かきく「プルダウンメニューA」
名称あいうえお「プルダウンメニューB」
要は、「 」の部分を揃えたい（縦に整列）のですが、うまくいきません。プルダウンメニューが飛び出してしまいます。
2段目のHTML記述部分がなぜ閉じタグから始まっているのかもよくわからないです。

端折ってますので、分かりにくいと思いますが、コメントいただける方、よろしくお願いします。

回答No.2

chupark · ベストアンサー

再び回答しにきました。
1. iframeについて
iframeタグにはそれ自身のサイズを指定するwidth(幅) と　height(高さ)の属性があります。
また、スクロールに関しても、scrolling=noとすることでスクロールバーの表示もコントロールできます。
<iframe src="hoge.cgi" width="50%" height="200" scrolling=no></iframe>

2. select周りについて
ようやくお悩みの部分がわかってきました。
純粋なＨＴＭＬなら理解されているようですね。

ならば、「foreach $i (@PREFs) 以下の部分は selectタグのoption部分にあたる部分である」という風に考えてください。

<<"---HTML---"; 部分をまたがっても構わないのです。</select>の部分も含めてテーブルにしてしまってください。

要は、perlって言語を使ってはいますが、結局はHTMLを書いているのです。

今回のプログラムをブラウザで実行させて、
画面に出した状態でソースを表示してみると分かりますが、
perlはhtmlを動的に書き出しているのであって、
結局はprintなどで書き出されるhtmlがページのレイアウトを決めます。

したがって、<<"---HTML---"; 部分をまたがってても、最終的に出力されるhtmlが正しければよいのです。

お礼

chupark様
ありがとうございます。１、の属性はあとで気付きました。これは問題なかったのですが、２、にて
<<"---HTML---";を気にせずにテーブルで挟んだら、うまくいきました！項目がはみでらずに表示されてます。
これでレイアウトはなんとかなりそうです。どうもご親切にありがとうございました。
なぜこうなるのか仕組みがまだ理解できてませんが、Perlも少しづつ勉強していこうと思います。また機会がありましたらよろしくお願い致します！

回答No.1

chupark

1.
カウンタープログラムなどのように、表示結果がGIFで表示されるようなものは<img>タグで埋め込まれていることがありますね。
そうではなく、formなども表示させたいのであれば、フレームか iframe を使うのはどうでしょうか？
<iframe srce="hoge.cgi"></iframe>

2.
perlで print と書かれいている部分は単純にその内容を出力する部分です。
HTML部分へ細工をしてレイアウトをいじってみてはどうでしょう？
具体的には、tableタグなどで　かきく、あいうえお の部分と <select>の部分とを別のセルへ入れるようにします。

ちなみに、例文でお書きになった部分は、
selectの中身になる option　の部分をプログラムで制御して　@AIUEOs に入っているものを表示させるようにしてあるようです。
プログラムでoptionをすべて書き終わった後、selectの閉じタグを改めてprint　で出力させているので閉じタグからはじまったような形になっています。

補足

早速のご回答、ありがとうございます。
１、については仰せのとおり、<iframe src="～ で表示できました。
ただ、フォームの大きさを、表示させたいサイズに指定するとスクロールバーがでてきてしまいます（また課題が・・・）

２、例えば、
<table>
<tr>
<td>かきく</td>
<td> <select name="kakikku"></select>
<option value="かきく"$kakiku_selected{'かきく'}>かきく</option> </td>
</tr>
<tr>
<td>あいうえお</td>
<td> <select name="aiueo"></td>
</tr>
</table>

---HTML---
foreach $i (@PREFs) { print "<option value=\"$i\"$aiueo_selected{$i}>$i</option>\n"; }

print <<"---HTML---";
</select>

---HTML---

このように名称と入力フォームをそれぞれテーブルに入れようとすると、“あいうえお”の方がプルダウンメニューからはみ出して表示されてしまうんです。
“かきく”の方は、正しく表示されます。“かきく”の方は<select>タグの直後に<option>でメニュー項目がきてるから正常に表示されるのだと思いますが、
“あいうえお”の方は、閉じタグ</select>だけが、挟んだテーブルタグの外側にきてしまってるからだと思うのですが、いかがでしょうか？

>プログラムでoptionをすべて書き終わった後、selectの閉じタグを改めてprint　で出力させているので閉じタグからはじまったような形になっています。

たぶんこの辺がよくわかっていないためだと思います。
</select>も含めてテーブルで囲むべきでしょうか。
そうすると、
---HTML---

<<"---HTML---";
をまたがってテーブルを記述することになるんですが・・・

でも大変参考になりました。ありがとうございました。