javascript - MVC (ASP.NET) 中的自动保存

Question

我正在实现一个网络系统来管理我公司的一些数据。我们正在使用 MVC(更具体地说是 ASP.NET MVC 4)，我对此完全陌生。

我遇到的问题是我们计划使用自动保存，就像 GMail 一样。我们计划使用更改事件排队，并偶尔通过 ajax 提交更改。起初我会使用 JavaScript，但不确定这是否是 MVC 的最佳方式。我遇到的另一个麻烦是用户输入的一些信息不在表单内，而是在表格中。此外，页面的布局有点稀疏，我不相信我可以将所有输入包装到一个表单中，即使我应该这样做。

我的问题是:

1. 使用 MVC 实现自动保存的最佳方式是什么，我应该使用还是不使用 JavaScript？
2. 是否有任何 JavaScript 库或 ASP.NET MVC 中的功能来实现排队，还是我应该手动完成？
3. 另外，我可以使用表格来换行吗？

注意:我看到一些建议使用 localstorage 或其他客户端持久性，但我需要的是服务器持久性，而我们在页面上什至没有保存按钮。

提前感谢您的帮助；)

Answer 1

您可以将 form="myformid" 属性添加到表单外部的元素以将其包含在表单中。我会在开头向所有元素添加 data-dirty="false" 属性，并附加更改事件，将更改元素的 data-dirty 属性更改为 true。然后您可以每 30 秒保存一次表单(例如获取具有 data-change=true 的元素并传递给服务器)。保存后，每个元素的 data-dirty 再次变为 false。使用 jQuery 自动保存的示例:

window.setInterval(function(){
    var dirtyElements = $('#myformid').find('[data-dirty=true]').add('[form=myformid][data-dirty=true]');
    if(dirtyElements.length > 0){
        var data = dirtyElements.serialize();
        $.post('saveurl', data, function(){
            dirtyElements.attr('data-dirty', false);
            alert('data saved successfully');
        });
    }
}, 30000); // 30 seconds

将事件附加到表单的所有元素:

$(function(){
    var formElements = $('#myformid')
                           .find('input, select, textarea')
                           .add('[form=myformid]')
                           .not(':disabled')
                           .each(function(){
                                $(this).attr('data-dirty', false).change(function(){
                                    $(this).attr('data-dirty', true);
                                });
                           });
});