如何将下拉值绑定到javascript数组？

Question

I am working in MVC and I have to bind dropdown values to an array in javascript. How do I do that?

dropdown list-

Html.DropDownListFor(m => m.MyActivityRequest.ToMonth, Model.MonthNames, new { @id = "monthToSelect" })

Javascript function:

$(document).ready(function(){ 
        $("#yearToSelect").change(function(){
            var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
            var date = new Date();
            var monthVar = date.getMonth();
            var yearVar = date.getFullYear();
            if ($(this).val() < yearVar ){
                $("#monthToSelect").find('option').remove();
                for( i = 0; i < 12; i++ ){          
                    $("#monthToSelect").append($("<option>",{
                        value: months[i],
                        text: months[i]
                    }));
                };
            }

you can see that the the array- 'months' is hard coded as of now. I want to dynamically bind the dropdown values to this array.

Answer 1

Js Fiddle Demo.

Inside your code place the below code appropriately.

Better Approach:

var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
var option = '';

for (i=0;i<months.length;i++){
   option += '<option value="'+ months [i] + '">' + months [i] + '</option>';
}

$('#monthToSelect').append(option);

Refered from here .

Answer 2

I think you have to pass the month list from controller. So in javascript you can make an ajax call and return the same list of months. You can use this list instead of array- 'months' in your javascript function.