javascript - 从 html View 中的 onchange 事件调用 Controller 函数

Question

我是一名新的 c# 开发人员，我有一个下拉列表，其中填充了格式如下的字符串日期:“2017 年 7 月”。列表中最多可以有 12 个条目。

当用户选择日期时，我想将该选择传递给 Controller ​​方法，将其转换为日期时间格式，然后使用该日期进行进一步处理。

如何将用户选择传递给 Controller ​​以便可以转换和使用？我在下面添加了注释掉的代码，以显示我想要如何进行转换。将日期发送给 Controller 是我面临的挑战。

我在这个网站上看过类似的问题，它们看起来都过于复杂(可能是由于我的天真)，但我希望有一个更简化的解决方案。

Html 查看代码

@Html.DropDownList("selectList", Model.ReverseMonthsLists())

查看模型代码

public IEnumerable<SelectListItem> ReverseMonthsLists()
    {
        var selectListItems = GetDates()
            .Select(_ => _.ToString("MMM yyyy"))
            .Select((dateString, index) => new SelectListItem 
                { Selected = index == 0, Text = dateString, Value = dateString })
            .ToList();
        return selectListItems;
    }

public static IEnumerable<DateTime> GetDates()
{
    DateTime startDate = new DateTime(2017, 6, 1).Date;
    var currentDate = DateTime.Now.Date;
    int numberOfMonthsToShow = (currentDate.Year - startDate.Year) * 12 + 
        currentDate.Month - startDate.Month;
    var dates = new List<DateTime>(numberOfMonthsToShow);
    currentDate = currentDate.AddMonths(-1);

    for (int i = 0; i < numberOfMonthsToShow; i++)
    {
        dates.Add(currentDate);
        currentDate = currentDate.AddMonths(-1);
    }

    return dates;
}

Controller 功能

    public ActionResult Report_Performance()
    {
        //var newDate = DateTime.Parse(strDate);  //<- Use newDate as parameter value into aVar to replace date at the end of the string
        var aVar = Models.Reporting.ListingStatsReportingViewModel.GetStats(userCurrentService.CompanyId.Value, Models.Reporting.DateTimePeriod.Monthly, DateTime.Now.Date.AddMonths(-1));
        return this.View(aVar);
    }

Answer 1

向 Controller 获取值的正常方法是用户将页面发布回服务器，例如通过提交按钮。当发生这种情况时， Controller 的操作方法可以接收所选项目作为参数，然后执行它需要执行的操作。因此，如果您只是希望用户提交表单，并允许网站根据所选值(以及您根据该值计算的列表)呈现下一页，这就是您需要做的全部事情。

另一方面，也许您不希望用户提交页面；您希望在页面中显示一系列日期，或者让浏览器中运行的代码处理这些日期。如果是这种情况，我建议您在浏览器本身内用 Javascript 执行计算，从而避免往返的需要。 GetDates() 方法中的任何内容都不需要任何服务器端数据，因此只需将 C# 代码转换为 Javascript 代码即可。

在极少数情况下，您会希望页面上的 UX 元素根据服务器计算立即更新，而不发布页面。如果这就是您想要的，您将不得不使用其他发帖者提供的 AJAX 解决方案。这要复杂得多，工作量也大得多。如果您不需要，请使用我上面提供的解决方案之一。