如何避免丢失 ASP.NET MVC 中的控件状态

Question

我正在使用 ASP.NET MVC 2 并构建一个简单的业务应用程序。以下是一些详细信息：

• 该应用程序处理工作订单和 有工作订单索引视图。这 view 有一个列出工作的表格 命令和一些控件（文本 框、复选框和下拉菜单 列表）来选择标准 要显示哪些工单。

• 我正在使用视图模型。工单 索引视图有一个视图模型 每个的属性 控制。

• 我已经实现了类似的分页 回答中正在做什么 这个问题： 如何在 ASP.NET MVC 中进行分页？ 我使用 LINQ 的 Skip() 和 Take() 作为 演示了，并且 ActionLinks 为 导航。

• 如果我加载页面但没有加载 操纵任何控件，我可以 单击页码 ActionLinks 并在之间很好地走动 工单页面。然而，如果我 改变一些东西，我的改变就丢失了 当我导航到另一个页面时。

  例如，如果我在第 1 页并且 单击未选中的复选框，然后 然后点击第2页的链接， 将加载结果的第二页 但复选框将恢复为原来的状态 之前的状态。

我理解为什么会发生这种情况，但我想知道从设计的角度来看最好的做法是什么。

我能想到的潜在解决方案：

1. 将所有控制值设置为路线 ActionLink 中的值。这 看起来真的很讨厌，并且可能会导致 在很长的 URL 或查询字符串中。 实际上，现在我想起来，如果没有捕获控件值的方法，这是行不通的。

2. 由于 ActionLinks 不发布 任何东西，用按钮替换它们。 同样，这似乎是一个坏主意。

3. 将 ActionLinks 更改为以下链接 触发一个执行以下操作的 jQuery 脚本 邮政。我认为这是最 到目前为止有希望的选择。做很多 开发人员这样做吗？

这似乎是一个很常见的问题，但这些选项都感觉不太正确。我想知道我是否错过了什么。

Answer 1

最好的办法是在用户分页时通过“记录”隐藏字段的更改来有效地模拟视图状态。为此：

1) 找出需要捕获的数据以及在 {ie -- json 对象数组} 中执行此操作的数据格式
2) 设置处理上一个/下一个的链接，以触发一个方法来收集“已更改”的内容并将它们填充到对象和隐藏字段中。
3）发布表单时，解析隐藏字段，提取数据和利润。

Answer 2

当用户切换复选框时（使用 jQuery），您不能将更改保存回数据库吗：

$("input[type=checkbox]").click(function() {
     $.ajax({
          type: "POST",
          url: "/ControllerName/SaveInfo?id=" + {id},
          success: function(){
                alert("Data Saved: " + msg);
          }
     });
});

Answer 3

最后，我最终放弃了分页的 ActionLink，并用常规锚标记替换了它们。当前页面索引现在存储在隐藏表单值中：

<input id="page" name="page" type="hidden" value="" />

<p>
    <% for (var i = 1; i <= (int)Math.Ceiling(Model.RowsMatchingCriteria / (double)Model.PageSize); i++) { %>

        <%--
            If the page number link being rendered is the current page, don't add the href attribute.
            That makes the link non-clickable.
        --%>
        <a class="pageLink" <%= i != Model.Page ? @"href=""javascript:void(0);""" : string.Empty %>><%: i %></a>

    <% } %>
</p>

然后我添加了以下 jQuery 脚本，该脚本设置隐藏页面值并在单击链接时提交表单：

$(document).ready(function () {

    $('.pageLink:[href]').click(function () {
        $('#page').val($(this).text());  // Set hidden field value to the text of the page link, which is the page number.
        $('form:first').submit();
    });

});

问题已解决。