入力フォーム内でのIF文

質問

入力フォームセレクトボタンで◆ラバー素材を選択した時のみ、カラーに青色をセットしたい。
以下の様に入力フォームを作成しましたが、なかなか上手く動作せずたいへん困っております。
どなたかご教授いただけますと幸いでございます。

<FORM action="postmail.cgi" method="POST">
素材を選んでください<br>
◆ベースの素材を選んでください<br>
<select name="◆ベースの素材">
<option selected>◆ラバー起毛素材</option>
<option>◆ラバー素材</option>
<option>◆ジャージ起毛素材</option>
<option>◆ジャージ素材</option>
</select>

<SCRIPT Language="JavaScript">
$name = $_POST["◆ベースの素材"];
if ($name == "◆ラバー素材")
{
<INPUT type="text" name="カラー" size="79" value="青色"><BR>
}
</SCRIPT>

回答No.2

newta777

javaではなくて
javascriptかperlの質問ですね。

内容については#1さんのものに任せます。
もし追加の質問があるようでしたら
javascriptかperlのカテゴリで質問した方が
回答が集まるかもしれません。

回答No.1

goo_mania

１．まず、JavaScriptの構文がおかしいです。
基本的には、関数の中で処理を書くようにします。
<script type="text/javascript">
function hoge() {
// ここに処理を書く
}
</script>

２．色を変更する場合は
document.getElementsByName("…")[0].style.backgroundColor="blue";
というように書く必要があります。

３．リストを選択した瞬間に値を切り替える場合は、
onChange="javascript:hoge();"
を<select>タグの中に追加する必要があります。

改良したコードを下に示しますので、違うところをよく観察してくだされば幸いです。
<FORM action="postmail.cgi" method="POST">
素材を選んでください<br>
◆ベースの素材を選んでください<br>
<select name="base_material" onChange="javascript:test();">
<option selected>◆ラバー起毛素材</option>
<option>◆ラバー素材</option>
<option>◆ジャージ起毛素材</option>
<option>◆ジャージ素材</option>
</select>

<input type="text" name="aaa" value="">

<SCRIPT Language="JavaScript">
function test() {
if (document.getElementsByName("base_material")[0].selectedIndex == 1) {
document.getElementsByName("aaa")[0].style.backgroundColor="blue";
} else {
document.getElementsByName("aaa")[0].style.backgroundColor="white";
}
}
</SCRIPT>
</FORM>

補足

たいへん親切なご教授ありがとうございます。

私の説明不足でしたのですが、正確には、背景色変更でなくベースカラー（値）の変更でございます。

ご教授いただいたソースをヒントに改良してみたのですが、
思った動作にならず、引き続き申し訳ございませんが、良きアドバイスいただけますと幸いでございます。

＜内容＞
ベースの素材選択部分でで◆オリジナル素材を選択した場合のみ、次のベースカラーの選択でオリジナルしか選択できない様にしたい。
どうぞ宜しくお願い致します。

**********************************************************
以下がうまく動作しないソースです。
**********************************************************
◆ベースの素材を選んでください<br>
<select name="base_material" onChange="javascript:test();">
<option selected>◆ラバー起毛素材</option>
<option>◆オリジナル素材</option>
<option>◆ジャージ起毛素材</option>
<option>◆ジャージ素材</option>
</select><br>
ベースカラー<BR>
<select name="aaa">
<option selected>◆青色</option>
<option>◆オリジナル</option>
<option>◆赤色</option>
<option>◆白色</option>
</select>

<SCRIPT Language="JavaScript">
function test() {
if (document.getElementsByName("base_material")[0].selectedIndex == 1) {
document.getElementsByName("aaa").item(0).value = "◆オリジナル";
} else {
document.getElementsByName("aaa")[0].style.backgroundColor="white";
}
}
</SCRIPT>