Home/ Questions/Q 8199789
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-07T06:14:35+00:00

i want to create select option dynamically. i have two array year and month.

  • 0

i want to create select option dynamically. i have two array “year” and “month”. when user select 2011 then its respective month should be display in next drop down. for example

if we select 2009 then next drop down option should be “dec”,”oct”,”feb’

<head>




<script type="text/javascript" src="jquery-1.7.2.js"></script>


<script type="text/javascript">

$(function (){

    $('#first').change(function(){

    var year= new Array('2011','2010','2009');
    var month= new Array('jan_feb_march','jan_march_april','dec_oct_feb');

    var yearVal= $('#first option:selected').text();


for(i=0; i<year.length;i++){


    if(year[i]==yearVal){

    var months=month[i]


}


}



    var y= months.split('_');

for (z=0;z<y.length;z++){


$('#second').append("<option>'"+y[z]+"'</option>")  

    }



    })
})


</script>


</head>

<body>


<div class="menu">
<select id="first">
<option>select</option>
<option>2011</option>
<option>2010</option>
<option>2009</option>

</select>
<select id="second"></select>

</div>


</body>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    See this DEMO:

    http://jsfiddle.net/rathoreahsan/vMuev/

    JQUERY:

    var categories = {
    "None":[{value:'3', text:'No cataegory selected'}],
    "2011":[{value:'1', text:'jan_feb_march'}],
    "2010":[{value:'2', text:'jan_march_april'}],
    "2009":[{value:'3', text:'dec_oct_feb'}]
};

function selectchange(){
    var select = $('[name=items]');
    select.empty();
    $.each(categories[$(':selected', this).text()], function(){
        select.append('<option value="'+this.value+'">'+this.text+'</option>');
    });
}

$(function(){
    $('[name=category]').on('change', selectchange);
});

    Hope this will be useful 🙂

    • 0