我有一个 Web 应用程序，其中包含一个使用 Ajax 回调创建的项目表。表格顶部的一堆表单字段允许我根据各种条件过滤将显示在表格中的项目并显示它。
表格的某些部分列出了旁边标有 [X] 的项目列表，我可以通过单击这些项目来删除这些项目。
现在，如果我以非 ajax/javascript 方式执行此操作，页面将接收到一堆 POSTed 数据字段，然后相应地呈现表格。我可以做到这一点，但我也想 Ajaxify 整个设置。我的问题是关于这个的。
我将如何创建 [X] 按钮。一个简单的
<a>会“工作”，但它是一个 GET 修改状态，所以我不想那样做。我现在这样做的方式是一个带有隐藏参数的小表单，而不是保存要删除的项目和一个样式化的提交按钮，即 [x]。如果我对此进行 ajax 化，我可以获得响应并执行必要的操作。如何保持后端 DRY？我不希望 Ajaxified 版本和常规版本有两个完全不同的代码位。我现在正在做的是让非 ajax 版本提交到一个更改状态的 URL，然后再次重定向到主页(类似于 PRG 类型系统)。启用 Ajax 后，我只需调用 URL 并忽略重定向，而是使用返回的数据来调整表格。这是“正确的方式”吗？
还有关于如何保持后端 DRY 的优雅降级的其他建议吗？
最佳答案
我会将每一行放入它自己的表单中(使用 method='POST')，并包括一个隐藏字段以说明要删除的项目。 [X] 将提交表单，并且在表单的提交事件中，如果不存在 XmlHttpRequest，只需将表单提交到服务器，服务器将删除该项目并再次重定向到同一页面(这是避免重新加载的好习惯重新提交删除 POST)。
如果存在 XmlHttpRequest，将其设置为 POST 并使用要删除的事物的 ID，然后在请求成功时删除该行。您可以在 AJAX 请求中设置一个标志，这样就不会发生重定向，只是成功 (200 OK)。
关于ajax - HTTP POST 和优雅降级，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/3980128/