1

这是一个设计/技术问题。

使用 ASP.NET MVC，我可以轻松地创建一个具有两个视图的简单应用程序，一个主视图以只读的表格形式显示所有记录。另一个详细信息视图以创建新记录。

我的目标是将详细信息表单与表格放在同一页面上。用户输入数据按保存并在表中添加新记录，而无需切换视图和重新加载内容。它基本上应该像在 stackowerflow 中发布新答案或评论一样工作。

我通过编写自己的 jQuery 代码并使用 JSON 与控制器操作进行通信找到了这样做的方法。这是在 ASP.NET MVC 中创建这些动态表单的方式吗？

使用这种方法，我面临以下设计/可扩展性问题：

  • 使用 jQuery 渲染新行在我看来有点混乱。
  • 如果您添加一个新字段，我有两个地方需要调整 - 一次在主视图中，第二次在 jQuery 脚本中。

目前我正在将新记录添加到表中，如下所示：

function addQueryField() {
      // Determine the index of the next row to insert
      var index = $("tr[id^=queryRow]").size();
      // Create DOM element for table row
      var oTr = $(document.createElement("tr")).attr("id", "queryRow" + index);
      // Create DOM element for value textbox
      var oValueTextBox = $(document.createElement("input")).attr("name", "query[" + index + "].Value").attr("id", "Value"+index).attr("type", "text"); 
    });

我基本上使用的是这里描述的技术。

可能有一些开箱即用的解决方案吗？

4

1 回答 1

1

如果我是你，我会将添加过程与更新表格“或部分页面”分开

我这样做是这样的：

  1. 客户点击添加按钮
  2. 我通过 jQuery 加载合适的Create局部视图并可能在模态窗口中显示它
  3. 客户填写表格并点击保存
  4. 在保存时，我首先验证表单，如果一切正常，我通过 jQuery 提交它并阻止页面提交
  5. 在控制器上，我执行Post所需的操作，如果有任何ModelState错误，那么我返回它们JSON以让客户端 java-script 代码向客户端显示这些错误
  6. 如果服务器没有返回错误，那么我通过 jQuery 通过再次调用服务器来更新“或您的表”页面的部分部分，并让Controller Action返回部分视图而不是完整页面视图。

我知道有很多事情需要更多解释，但我希望这个想法很清楚

于 2012-06-10T15:14:22.113 回答