Question

我正在实施一个网络系统来管理我公司的一些数据。我们正在使用MVC（更具体地说是ASP.NET MVC 4），我完全不熟悉它。

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

我的问题是：

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

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

先谢谢你的帮助;）

Answer 1

您可以将form="myformid"属性添加到表单外的元素以将其包含在表单中。我会在开头的所有元素中添加data-dirty="false"属性，并附加将更改元素的data-dirty属性更改为true的change事件。然后，您可以每30秒保存一次表格（获取data-change = true并传递给服务器的元素）。保存后，每个元素的数据脏都会再次变为假。使用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);
                                });
                           });
});

Answer 2

...答案

绝对使用javascript和AJAX，您不希望页面在用户进行更改时保持刷新
我不知道任何图书馆，但我很乐意手工完成。使用javascript检测更改，然后通过AJAX发布数据
您可以使用FormCollection参数或经典Form["fieldname"]方法访问控制器中的任何表单字段。只要您的表格单元格具有唯一的name值，您就可以获取数据

Answer 3

这真的是你唯一的选择。如果您在没有Ajax的情况下提交表单，那么您将体验整页重新加载。听起来不像你想要的那样。
有很多方法可以实现这一点（另请参阅刚刚发布的karaxuna答案）。您可以将事件附加到所有输入，并且在任何更改时使用计时器保存数据。如果发生另一个更改事件，则重置计时器，这样您就不会为每个更改事件保存。

或者如果您不需要它那么复杂，只需使用一个简单的计时器来保存每X分钟，无论是否输入任何新数据。
您可以在form内放置一张表格;这没什么不对。我建议使用正确的输入，以便将数据序列化并将其发送到服务器。

Answer 4

1）使用Javascript！ jQuery使用AJAX调用在后台异步执行自动保存非常容易。

2）我没有意识到，但它不应该太难。

3）不，不幸的是你不能，但你可以这样做：

<table id="mainTable">
 <tr>
  <td>
   <form id="someForm">
        <table class="aSubTable">
         <tr>
          <td><!-- fields go here --></td>
          <td><!-- fields go here --></td>
         </tr>
        </table>
   </form>
  </td>
 <tr>
</table>

（我知道这个示例代码没有利用Razor，但是用你自己的方法找出用Razor替换哪些部分并不难）

Answer 5

您可以使用SignalR集线器在您的页面和服务器之间动态通信。有关此技术的详细信息，请参阅https://github.com/SignalR/SignalR/wiki和http://signalr.net/。

这样，您可以将更改事件直接发送到服务器。您可以使用JavaScript中的生产者 - 消费者模型来限制它们，但SignalR的性能足够好，您应该能够逃脱而不必这样做。

您可以在表单中嵌入表格，但SignalR再次使用不同的客户端到服务器通信方式。

祝你好运。

Answer 6

BolgDbContext

Answer 7

仅针对您的问题1的部分答案：是的，开箱即用，mvc 4将使用javascript（jquery）和ajax

运行良好

上面的答案向您展示了在剃须刀视图中编写javascript / ajax的一些方法，然后您将与控制器（应该从“模型”获取数据）进行通信，然后是整个.net的一部分mvc框架体验与各种设置相关联，然后您可以在更改值为false时测试web.config

实施例

在你的web.config中

，你会看到

<appSettings>
    <add key="webpages:Version" value="2.0.0.0" />
    <add key="webpages:Enabled" value="false" />
    <add key="PreserveLoginUrl" value="true" />
    <add key="ClientValidationEnabled" value="true" />
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
</appSettings>

MVC 3甚至可以很好地运作：

<appSettings>
    <add key="webpages:Version" value="1.0.0.0" />
    <add key="ClientValidationEnabled" value="true" />
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
</appSettings>

MVC中的自动保存（ASP.NET）

7 个答案: