unpoly - 有条件的 unpoly 模态对话框关闭

Question

我在页面上有一个项目列表和一个带有属性 [up-modal] 的链接，指向带有用于将新项目添加到列表的表单的页面。该表单在模态对话框中打开并具有属性 [up-target]，因此它是在 unpoly 的帮助下由 Ajax 提交的。

我想不通的是如何关闭对话框并更新基础页面上的项目列表，以防提交表单时没有错误并且服务器端出现错误我希望对话框保留打开并显示有错误的表格。

如果我将属性 [up-sticky] 添加到打开模态对话框的链接，则正确提交表单的结果会出现在模态对话框中，而不是放在页面上。

如果没有 [up-sticky] 属性，提交后出现错误的表单将替换底层页面。

那么如何做到这一点呢？

Answer 1

我假设你有一条路线 /page-with-list和路线 /modal-form .

在/page-with-list你有一个<div class="list">...</div> .

在/modal-form我会写 <form>像这样:

<form action="/process-modal-form" up-target=".list" up-layer="page" up-fail-layer="modal">
  ..
</form>

这应该取代 .list如果表单成功，则在页面层，但如果失败，则替换模态层的表单。在表格中，Unpoly 将自动设置一个 up-fail-target匹配表单的属性。