asp.net - 表单发布后如何绑定月份下拉值？

Question

这就是我们实现年和月级联下拉的方式。选择年/月后，表格被提交。当提交后查看返回时，选定的年份值是持久的（因为我们在模型中对此进行了处理），但选定的月份值不是持久的。需要做什么来保持价值？

模型

public class MyViewModel
{
    public int? Year { get; set; }
    public int? Month { get; set; }

    public IEnumerable<SelectListItem> Years
    {
        get
        {
            return Enumerable.Range(2000, 12).Select(x => new SelectListItem
            {
                Value = x.ToString(),
                Text = x.ToString()
            });
        }
    }
}

控制器

HttpGet 和 HttpPost 动作，

//
    // GET: /MenuSix/

    public ActionResult Index()
    {
        var model = new MyViewModel();
        return View(model);
    }

    public ActionResult Months(int year)
    {
        if (year == 2011)
        {
            return Json(
                Enumerable.Range(1, 3).Select(x => new { value = x, text = x }),
                JsonRequestBehavior.AllowGet
            );
        }
        return Json(
            Enumerable.Range(1, 12).Select(x => new { value = x, text = x }),
            JsonRequestBehavior.AllowGet
        );
    }

    //
    // POST: /MenuSix/
    [HttpPost]
    public ActionResult Index(MyViewModel myViewModel)
    {
        var month = myViewModel.Month; //11
        var year = myViewModel.Year;   //2011
        return View(myViewModel);
    }

看法

这里需要改变什么来保持月份值“Enumerable.Empty()”？

@model DemoWeb.Models.MenuSix.MyViewModel
@using (Html.BeginForm())
{
@Html.DropDownListFor(x => x.Year, new SelectList(Model.Years, "Value", "Text"), "-- select year --")
@Html.DropDownListFor(x => x.Month, Enumerable.Empty<SelectListItem>(), "-- select month --")

<div align="center">
    <input type="submit" id="valSubmit" value="Save"/>
</div>
}

@section PageScriptsAndCSS{
<script type="text/javascript">
    $(document).ready(function () {
        $('#Year').change(function () {
            debugger;
            var selectedYear = $(this).val();
            if (selectedYear != null && selectedYear != '') {
                $.getJSON('@Url.Action("Months")', { year: selectedYear }, function (months) {
                    var monthsSelect = $('#Month');
                    monthsSelect.empty();
                    $.each(months, function (index, month) {
                        monthsSelect.append($('<option/>', {
                            value: month.value,
                            text: month.text
                        }));
                    });
                });
            }
        });
    });
</script>

}

Answer 1

是的，您需要更改绑定月份下拉列表的方式。因为，您将它与一个空列表绑定在表单提交后您将不会获得选定的月份值。我以我的方式更改了您的代码。让我知道它是否适合您的需要。

模型

public class MyViewModel
{
    public int? Year { get; set; }
    public int? Month { get; set; }

    public static IEnumerable<int> GetMonthsRangeOf(int year) { 
        return (year ==2011) ? Enumerable.Range(1, 3) : Enumerable.Range(1, 12);
    }

    public IEnumerable<SelectListItem> Years { get {
        return Enumerable.Range(2000, 12).Select(x => new SelectListItem
        {
            Value = x.ToString(),
            Text = x.ToString()
        });

    } }

    public IEnumerable<SelectListItem> Months
    {
        get
        {
            IEnumerable<SelectListItem> months = null;
            if (! this.Year.HasValue)
            {
                months = Enumerable.Empty<SelectListItem>();
            }
            else
            {
                months = GetMonthsRangeOf(this.Year.Value).Select(x => new SelectListItem
                {
                    Value = x.ToString(),
                    Text = x.ToString()
                });
            }

            return months;
        }
    }
}

控制器

public ActionResult Months(int year)
    {
            return Json(
                MyViewModel.GetMonthsRangeOf(year).Select(x => new { value = x, text = x }),
                JsonRequestBehavior.AllowGet
            );
    }

    //
    // POST: /MenuSix/
    [HttpPost]
    public ActionResult About(MyViewModel myViewModel)
    {
        var month = myViewModel.Month; //11
        var year = myViewModel.Year;   //2011
        return View(myViewModel);
    }

看法

    @model TestFreezeMVC.ViewModel.MyViewModel
@using (Html.BeginForm())
{

@Html.DropDownListFor(x => x.Year, new SelectList(Model.Years, "Value", "Text"), "-- select year --")

@Html.DropDownListFor(x => x.Month, new SelectList(Model.Months, "Value", "Text"), "-- select month --");


<div align="center">
    <input type="submit" id="valSubmit" value="Save"/>
</div>
}

<script type="text/javascript">
    $(document).ready(function () {
        $('#Year').change(function () {
            var selectedYear = $(this).val();
            if (selectedYear != null && selectedYear != '') {
                $.getJSON('@Url.Action("Months")', { year: selectedYear }, function (months) {
                    var monthsSelect = $('#Month');
                    monthsSelect.empty();
                    $.each(months, function (index, month) {
                        monthsSelect.append($('<option/>', {
                            value: month.value,
                            text: month.text
                        }));
                    });
                });
            }
        });
    });

</script>

建议我是否做错了什么..