1

値の配列を別のラジオ ボタンにマッピングするのが難しい場合があります。これが HTML です。変数の名前を変更して、現在作成している特定の Web フォームに固有のものではなく、一般的なものにしました。

<input type="radio" NAME="type" id="rbtA"><span id="txtA">Alt. A</span>
<input type="radio" NAME="type" id="rbtB"><span id="txtB">Alt. B</span>
<input type="radio" NAME="type" id="rbtC"><span id="txtC">Alt. C</span>

<input type="radio" NAME="COM" id="rbtSub1"><span id="txtSub1">SubAlt. 1</span>
<input type="radio" NAME="COM" id="rbtSub2"><span id="txtSub2">SubAlt. 2</span>
<input type="radio" NAME="COM" id="rbtSub3"><span id="txtSub3">SubAlt. 3</span>
<input type="radio" NAME="COM" id="rbtSub4"><span id="txtSub4">SubAlt. 4</span>

<input type="radio" NAME="Coupling" id="rbtSubSub1"><span id="txtSubSub1">Yes</span>
<input type="radio" NAME="Coupling" id="rbtSubSub2"><span id="txtSubSub2">No</span>

<SELECT id="selectCom" style="width: 160" NAME="Communication"><OPTION selected="selected"></OPTION></SELECT>

代替 B または C を選択すると、ラジオ ボタン rbtSub1 ~ rbtSub4 が表示されます。C を選択すると rbtSubSub1 と rbtSubSub2 は非表示のままですが、B(SubAlt. 1 または SubAlt. 2) を選択すると rbtSubSub1 と rbtSubSub2 が表示されます。これらのボタンを表示/非表示にすることは問題ありません。問題は、選択されているラジオ ボタンに応じて、正しい選択肢を選択ボックス selectCom にマップすることです。

selectCom の代替が rbtSub1 - rbtSub4 のみに依存している場合、マッピングは簡単です。

var arraySub1=["1A", "1B", "1C"];
//(correspondingly for sub2 and sub3)...
var arraySub4=["4A", "4B", "4C"];
var mapCom = { rbtSub1 : arraySub1, rbtSub2 : arraySub2, rbtSub3 : arraySub3, rbtSub4 : arraySub4 } 

次に、jqueryコードのどこかで、ユーザーが選択したサブ代替に応じてselectComにデータを入力するこのコードがあります(これは機能します。フォームの他の場所を使用しました):

$('#rbtSub1, #rbtSub2, #rbtSub3, #rbtSub4').change(function() {
  $("#selectCom option").remove();
  $.each(mapCom[this.id], function(i, val) {
    var opt = $("<option />");
    opt.appendTo($("#selectCom")).text(val).val(val);
  });
});

トリッキーな部分は、rbtB(rbtSub1 または rbtSub2) が選択されている場合、ユーザーが rbtSubSub1 または rbtSubSub2 のどちらを選択しているかに応じて selectCom を設定する必要があることですが、rbt B と (rbtSub3 または rbtSub4) が選択されている場合は、selectCom を設定する必要があります。ユーザーが rbtSub3 または rbtSub4 を選択したかどうか。さらに、rbtC が選択された場合、選択されたもの (rbtSub1、rbtSub2、rbtSub3、または rbtSub4) に応じて、selectCom のみを設定します。

同じマッピング コード行で同じレベルにないラジオ ボタンをマッピングしようとしましたが、フォームを実行しようとするとエラーが発生します。

これを達成する方法について何か良い提案はありますか?

4

1 に答える 1

0

最良の解決策はphpにあります... htmlを分割し、値XまたはXが選択されている場合はそこにIFステートメントを入れます echo style="display:none"

于 2012-09-26T11:42:03.877 に答える