- PR -

Javascriptでラジオボタンの変更

1
投稿者投稿内容
とみい
会議室デビュー日: 2006/10/10
投稿数: 1
お住まい・勤務地: 中央区
投稿日時: 2006-10-10 15:52
JavaScript初心者で場違いかも知れませんが、宜しくお願いします。
現在あるショッピングカートを作成していて、ある商品には３種類のバリエーションがあります（A,B,C）これらにはオプションが３つ（1,2,3）ありAには1,2、Bには2,3、Cには1,3のように別々のオプションが選べるような商品の表示をしたく、ドロップダウンメニューでA,B,Cを選択すると、対応したラジオボタンが1,2 / 2,3 / 1,3のように変化するところまではできたのですが、それをCGIプログラムに送る時の<option value="●○">内の値が変更できなく困っています。
一応スクリプトは
<script Language="JavaScript"><!--
sMenu = new Array();
sMenu[0] = new Array("ハイバック","ミッドバック");
sMenu[1] = new Array("ハイバック","ハイバック");
sMenu[2] = new Array("ミッドバック","ミッドバック");

function setCheckbox(n)
{
for (i=0; i<2; i++) document.all["typ"+i].innerText = sMenu[n][i];
}
// --></script>

<select name="o-バリエーション" onChange="setCheckbox(this.selectedIndex)">
<option value="S スタンダード_13800">S スタンダード</option>
<option value="M メッシュ_18900">M メッシュ</option>
<option value="V バリュー_0">V バリュー</option>
</select>
<input type="radio" name="o-背タイプ" value="ハイバック_0" checked><span id="typ0">ハイバック</span>
<input type="radio" name="o-背タイプ" value="ミッドバック_0"><span id="typ1">ミッドバック</span>

こんな感じです。
現在は<span id="">○●</span>内の表記はダイナミックに変更できる状態なのですが、手前、<input type="radio" value="●○">は変更されずに困っています。

ちなみにname= "o-"の部分、value="XXX_12600"の"_"と数字の部分はCGIの都合上変更できない仕様になってます。
JavascriptにもCGIにも詳しくないので、解決方法が浮かびません。どなたかお解かりになる方、ご教授頂けませんでしょうか。宜しくお願いします。

**追記**
後から、ラジオボタンではなく、ドロップダウンでの方法に切り替えてみました。
<script language="JavaScript"><!--
menuItem = [ ["ミッドバック","ハイバック"],
["ハイバック","ハイバック"],
["ミッドバック","ミッドバック"] ];
itemNum = 2; //　項目数
function setMenuItem(n)
{
for (i=0; i<itemNum; i++)
{
document.myForm."o-オプション".options[i] = new Option(menuItem[n][i],menuItem[n][i]);
}
}
// --></script>

<form name="myForm">
<select name="Maker" onChange="setMenuItem(this.selectedIndex)">
<option value="S">S</option>
<option value="M">M</option>
<option value="V">V</option>
</select>
<select name="o-オプション">
<option value="ミッドバック">ミッドバック</option>
<option value="ハイバック">ハイバック</option>
</select>
※ただ、使っているショッピングCGIオプション項目設定でname属性には"o-"からはじまるモノを記述とあってその通りに記述すると動きません。いろいろ調べて、"-"（ハイフン）抜きで記述すると動きます。
どなたか、上記スクリプト中に"-"ハイフンを使えるようにできる方も合わせてご教授頂けたら幸いです。

[ メッセージ編集済み 編集者: とみい 編集日時 2006-10-10 17:56 ]
ant
ベテラン
会議室デビュー日: 2002/07/11
投稿数: 51
投稿日時: 2006-10-10 19:00
最初に書かれていた例の方について
document.getElementsByName("o-背タイプ")[0].value
とかを使えばいいと思います。
1

スキルアップ／キャリアアップ（JOB@IT）