2009-05-04 12 views
0

Javaスクリプトを使用してdiffent-2ラジオボタンを選択すると、選択肢リストを動的に入力する必要があります。javascriptを使用して異なる2つのラジオボタンの選択肢を選択リストに入力する方法

{ 
var i; 
var x1; 
var x3; 
var x=document.getElementById("ddbudget_min");//option list1 
var x2=document.getElementById("ddbudget_max");//optionlist2 
x1=x.length; 
for (x1 = x.length; x1 >= 0; x1--) { 
     x[x1] = null; 
} 
x3=x2.length; 
for (x3 = x2.length; x3 >= 0; x3--) { 
    x2[x3] = null; 
} 


x[0] = new Option("select min", 1); 
x[1] = new Option(1000, 2); 
x[2] = new Option(5000, 3); 
x[3] = new Option(10000, 4); 
x[4] = new Option(20000, 5); 
x[5] = new Option(50000, 6); 
x[6] = new Option("1 lakh", 7); 
x[7] = new Option(">1 lakh", 8); 

x2[0] = new Option("select max", 0); 
x2[1] = new Option(1000, 1); 
x2[2] = new Option(5000, 2); 
x2[3] = new Option(10000, 3); 
x2[4] = new Option(20000, 4); 
x2[5] = new Option(50000, 5); 
x2[6] = new Option("1 lakh", 6); 
x2[7] = new Option(">1 lakh", 7); 
} 
+0

これは間違っていますか? – staticsan

答えて

1

@Saurabh正常に動作していない - あなたはjQueryの(私は同意するだろうこれは行くための最良の方法です)、私はあなたが、昔ながらの中で探しているものがある可能性がありますを仮定しているに興味がないので、学校のjavascriptスタイル。下のhtml/javascriptをコピーして試してみてください。

<html> 
<head> 
    <title>Test Page For Min/Max Options</title> 
<script>  
var minOptions=[]; 
minOptions[0] = new Option("Select Min", 1); 
minOptions[1] = new Option(1000, 2); 
minOptions[2] = new Option(5000, 3); 
minOptions[3] = new Option(10000, 4); 
minOptions[4] = new Option(20000, 5); 
minOptions[5] = new Option(50000, 6); 
minOptions[6] = new Option("1 lakh", 7); 
minOptions[7] = new Option(">1 lakh", 8); 

var maxOptions=[]; 
maxOptions[0] = new Option("Select Max", 0); 
maxOptions[1] = new Option(1000, 1); 
maxOptions[2] = new Option(5000, 2); 
maxOptions[3] = new Option(10000, 3); 
maxOptions[4] = new Option(20000, 4); 
maxOptions[5] = new Option(50000, 5); 
maxOptions[6] = new Option("1 lakh", 6); 
maxOptions[7] = new Option(">1 lakh", 7); 

window.onload = function() { 
    for(i=0; i < minOptions.length; i++){ 
     document.getElementById("ddbudget_min").options.add(minOptions[i]); 
    } 
    for(i =0; i < maxOptions.length; i++){ 
     document.getElementById("ddbudget_max").options.add(maxOptions[i]); 
    } 
} 
function selectMinMax(e){ 
    document.getElementById("ddbudget_min") 
      .style.display = e.value == 'min' ? 'block' : 'none'; 
    document.getElementById("ddbudget_max") 
      .style.display = e.value == 'max' ? 'block' : 'none'; 
} 

</script> 
</head> 
<body> 
<form method="get" action=""> 
    <input type="radio" name="radioMinMax" value="min" 
        onclick="selectMinMax(this)" checked />Minimum 
    <input type="radio" name="radioMinMax" value="max" 
        onclick="selectMinMax(this)" />Maximum<br/> 
    <select id="ddbudget_min" name="ddbudget_min" 
           style="display:block"></select> 
    <select id="ddbudget_max" name="ddbudget_max" 
           style="display:none"></select> 
</form> 
</body> 
</html> 
関連する問題