MVC/Razor:使用下拉列表中的参数调用操作方法更改事件和来自操作链接按钮值的参数

Question

我继承了一个 ASP.NET 的MVC项目(左派(，需要更改，因此试图了解该项目的工作原理以及如何修复它。

这是一个用于记录和编辑时间表的应用程序 时间表代码段

当用户选择月份时，显示内容将更改并显示该月的数据。问题是，前一个家伙不允许超过一年，所以点击 8(例如(，显示 8 月份今年和前几年的数据。我添加了年份按钮，以便用户可以选择年份。

控制器是：

public ActionResult MyTimesheets(int? month, int? year)
{
if(year == null)
{
year = DateTime.Now.Year;
}
if(month == null)
{
month = DateTime.Now.Month;
}
ViewBag.UserName = GetCurrentUserName();
//  Get list of years in data for drop-down box
var yearList = new SelectList(contextdb.TimeSheetsDb.Select(y => y.TimeSheetDate.Year).Distinct().OrderByDescending(y => y.ToString()).ToList());
ViewData["YearList"] = yearList;
var myTimeSheets = contextdb.TimeSheetsDb.Include(x => x.UserTS).Where(x => x.UserTS.UPN == User.Identity.Name && x.TimeSheetDate.Month == month.Value && x.TimeSheetDate.Year == year.Value).ToList();
return View(myTimeSheets);
}

我添加了年份计并更改了查询以按年份和月份进行过滤。

他使用循环来创建每个月的按钮：

@for (int i = 1; i <= 12; i++)
{
if (Model.First().TimeSheetDate.Month == i)
{
@Html.ActionLink(i.ToString(), "MyTimesheets", new { month = i }, new { @class = "btn btn-success", style = "margin-left: 3px" });
}
else
{
@Html.ActionLink(i.ToString(), "MyTimesheets", new { month = i }, new { @class = "btn btn-default", style = "margin-left: 3px" });
}
}

我根据控制器中的视图数据添加了下拉列表：

<td>@Html.DropDownList("YearList", (IEnumerable<SelectListItem>)ViewData["YearList"], new { @onchange = "CallChangefunc(this.value)" })</td>

这有一个 onchange 事件，因此当用户选择不同的年份时，将使用年份的新参数值调用操作事件：

<script>
function CallChangefunc(val) {
var url;
url = "/TimeSheets/MyTimeSheets/?year=" + val;
window.location.href = url;
}

这行得通，我花了很长时间才到达这里。

我现在挣扎的是，如果用户单击不同月份的按钮，如何将新的月份值和当前选择的年份作为年份参数传递给操作方法。

相反，如果更改年份，则与onchange事件一起传递当前单击的月份。

Answer 1

如果您需要像对onchange事件所做的那样执行相同的javascript代码 只需在创建按钮时添加按钮 例如：

@Html.ActionLink(i.ToString(), "MyTimesheets", new { month = i }, new { @class = "btn btn-success", style = "margin-left: 3px", @onclick = "CallClickfunc("+i+")" });

传递该函数上的 i 值 现在Javascript函数将是

function CallClickfunc(val){
//Here get the selected value of Year drop down and pass it to URL
var year = $('#YearList').val();
$('#hdnMonth').val(val);
var url;
url = "/TimeSheets/MyTimeSheets/?year=" + year +"&month="+val;
window.location.href = url;
}

这将适用于按钮单击和年份。

****** 简单地说，您可以创建一个隐藏值来存储我们将在我们创建的上述函数中更改的月份值 您可以添加

@for (int i = 1; i <= 12; i++)
{
if (Model.First().TimeSheetDate.Month == i)
{
@Html.ActionLink(i.ToString(), "MyTimesheets", new { month = i }, new { @class = "btn btn-success", style = "margin-left: 3px", @onclick = "CallClickfunc("+i+")" });
<input type="hidden" name="hdnMonth" id="hdnMonth" value=""+i+"">
}
else
{
@Html.ActionLink(i.ToString(), "MyTimesheets", new { month = i }, new { @class = "btn btn-default", style = "margin-left: 3px", @onclick = "CallClickfunc("+i+")" });
<input type="hidden" name="hdnMonth" id="hdnMonth" value=""+i+"">
}
}

在此之后，您的onchange函数将更改为从隐藏中获取值并附加URL

function CallChangefunc(val) {
var month = $('#hdnMonth').val();
var url;
url = "/TimeSheets/MyTimeSheets/?year=" + val+"&month="+month;
window.location.href = url;
}

此代码适用于您所说的两种功能。

是的，我们有一个更好的选择来做到这一点，但为了像你所做的那样继续使用代码以使您更轻松，我继续这样做。