javascript - 为什么在加载 View 和单击 ASP.NET MVC 中的 Html.ActionLink 之间，我的 routeValues 变量会发生变化？

Question

我有一个 ASP.NET MVC 应用程序，其中有一个带有 jquery datePicker 的文本框和一个 HTML.ActionLink，它将下载一个 Excel 文档，该文档使用从 datePicker 中选取的日期字符串。我希望 Excel 下载链接使用此日期字符串作为其查询字符串中的参数。

在示例代码中，我将为我的类和变量提供示例名称。

这是我的主视图的摘录( View 名为“TestView”，模型属于“TestModel”类):

        @using (Ajax.BeginForm("TestForm", FormMethod.Post,
        new AjaxOptions
        {
            UpdateTargetId = "IdSomething",
            OnFailure = "handleFailure(xhr, status, 'IdSomething')"
        }))
    {
        @Html.AntiForgeryToken()
        @Html.Action("TestSettings", Model)
        <div class="clear margin-bottom-adjusted">
            @Html.ActionLink(Markup.Download_As_Microsoft_Excel, "Download",
            new { InstantlyUpdatedDate = Model.InstantlyUpdatedDate },
            new { @class = "download-excel" });
        </div>
    }

这是“TestSettings” View 的相关摘录(它还使用“TestModel”类的模型)。此处的提交按钮和变量“NotInstantlyUpdatedDate”用于更新图表，但这不应与 Excel 下载相关:

<div>
    @Html.TextBoxFor(m => m.NotInstantlyUpdatedDate, new { @class = 
    "datepicker", @onchange = "setExcelDownloadDate(" + @Json.Encode(Model) + 
    ", $(this))" })
    <input type="submit" value="@Markup.Update" class="btn" />
</div>

“setExcelDownloadDate”函数在 JavaScript 中定义如下:

function setExcelDOwnloadDate(model, item) {
    if (item.attr('name') === "NotInstantlyUpdatedDate")
    model.InstantlyUpdatedDate = item.val();

$.ajax({
    url: '../Test/UpdateTestView',
    type: 'post',
    data: {
        model: model
    }
});

}

我的 Controller 的相关摘录:

public TestController

{

    //Should only get called once by another view
    [HttpPost]
    public ActionResult InitTestView(TestModel model)
    {
         model.NotInstantlyUpdatedDate = "2018, 01, 01";
         model.InstantlyUpdatedDate = model.NotInstantlyUpdatedDate;
         return PartialView("TestView", model);
    }
    [HttpPost]
    public ActionResult UpdateTestView(TestModel model)
    {
        return PartialView("TestView", model);
    }

    [HttpPost]
    public Task<ActionResult> Download(DownloadModel model)
    {
       //download the model here
    }
}

这是本示例的“TestModel”类:

[Serializable]
public class TestModel
{
    public string NotInstantlyUpdatedDate { get; set; }
    public string InstantlyUpdatedDate { get; set; }
}

这是我的 DownloadModel 类:

public class DownloadModel
{
    public string InstantlyUpdatedDate { get; set; }
}

好的，谢谢你对我的耐心。这是发生的事情:

首先调用 InitTestView 方法，并呈现一个 TestView。如果我在 TestView 中的 @Html.ActionLink 行放置一个断点，它将显示 model.InstantlyUpdatedDate 变量是“2018, 01, 01”(这是正确的，也是预期的行为)。

由于 TestSettings View 嵌入在 TestView 中，因此它将为我的日期选择器呈现 Html.TextBoxFor。如果我现在检查浏览器中的“下载”按钮，将显示正确的下载查询字符串，并以日期“2018, 01, 01”作为参数。

现在，假设我从日期选择器中选择日期(“2018, 01, 02”)(到日期字符串的转换是在 jquery 中完成的，不用担心这一点，因为它按预期工作)。该日期现在将显示在文本框中，@onchange 事件将触发我的 javascript 函数 setExcelDownloadDate。在这个方法中，我可以放置断点并看到我的 model.InstantlyUpdatedDate 确实已设置为“2018, 01, 02”。这是正确的行为。

ajax 调用从 javascript 函数将模型对象发送到我的 TestController。如果我中断 UpdateTestView 函数，我可以查看我的模型变量，并且还可以在此处看到该值已更改为“2018, 01, 02”。工作正常。

既然这个方法返回了带有更新模型的 TestView 的新实例，我仍然可以在 Html.ActionLink 行处中断，并看到确实如此，Model.InstantlyUpdatedDate 是“2018, 01, 02”，即正确。

然而，问题来了。如果我检查浏览器中的链接，我会发现该网址不正确。日期不是“2018, 01, 02”，而是“2018, 01, 01”。如果我单击链接并在 Download 方法中放置断点，则模型的 InstantlyUpdatedDate 属性也将为“2018, 01, 01”而不是“2018, 01, 02”。

由于某种原因，模型属性 InstantlyUpdatedDate 似乎变回其原始值。我不知道为什么会发生这种情况，因此我询问你们中的一些人是否可以帮助我。这是一个更大的代码库的一部分，我不知道的东西当然可能会破坏正在发生的事情。也可能是出于某种原因，这是预期的行为，而我只是不太熟悉它应该如何工作。

感谢您的宝贵时间。

Answer 1

我在执行此操作时遇到了一些麻烦，但我会尝试一下。看来您没有对 $.ajax 的结果执行任何操作。它将返回所有内容都已填满的部分 View ，但不会执行任何操作。

$.ajax({
    url: '../Test/UpdateTestView',
    type: 'post',
    data: {
        model: model
    }
}).done(function( html ) {
    // $( "#results" ).append( html ); // Put the html somewhere
  });

就我个人而言，在 onchange 中，我只会更新链接而不是整个部分 View 。当有比链接更多的更改时，我通常会更新部分 View 。

$('#linkId').attr('href', '@Url.Action(Markup.Download_As_Microsoft_Excel, "Download")?InstantlyUpdatedDate=' + item.val());