javascript - MVC Razor 列表项上下移动

Question

我需要上下移动项目，才能删除和添加。

我可以在服务器端完成，但我相信这也可以在客户端完成，使用 javascript 之类的。我是 Web 开发的新手，如果有人可以给我一些示例或指出如何实现我的目标的方向，我将不胜感激。

@for (int i = 0; i < Model.Items.Count; i++)            
{
   <tr>
      <td>@Html.EditorFor(model => model.Items[i].Id)@Html.HiddenFor(model => model.Items[i].Id)</td>
      <td>@Html.EditorFor(model => model.Items[i].Type)@Html.HiddenFor(model => model.Items[i].Type)</td>
      <td>@Html.EditorFor(model => model.Items[i].Address)@Html.HiddenFor(model => model.Items[i].Address)</td>
   </tr>
}

Answer 1

为了进行渲染，您应该查看一个 javascript 模板引擎，例如：

车把 ( http://handlebarsjs.com/ ) 小胡子: ( http://mustache.github.io/ )

还有很多其他的，但它们允许您通过 javascript 将新行附加到表中，或者您可以（不推荐）直接在 javascript 中构建 HTML。

当然，如果您要向表中添加数据，您还可能希望将该数据发送回您的服务器，以便保存到您的数据库中。