Grails 和 AJAX：使用 ModalBox 或 YUI2 Dialog 进行 Grails 表单验证？

Question

几个 Grails 应用程序，比如我正在编写的应用程序，需要一个 /user 视图和 /admin 视图，它们是“仪表板”，基本上用户或管理员登陆该页面，可能在成功登录和所有数据表和选项卡在那里，因此他们几乎不需要离开该页面，从而提供更令人满意的用户体验，就像 Gmail 或 Mint 的用户已经习惯了一样。

为了允许从 /user 主仪表板进行搜索和形成帖子，我一直在使用 modalbox 插件 v0.4 grails install modalbox。 Modalbox 显然正在管理 GET/POST 本身，不幸的是，它丢失了典型约束块为您提供的 99% 的验证。

现在通过替换 g:submitButton 来解决这个问题，在提交中放置一些基本的 JavaScript，如图所示。 （当然，这是一个糟糕的解决方法。）

<input type="button" name="create" class="save" onclick="if (!(document.getElementById('name').value === '' || document.getElementById('summary').value === '')) { document.forms[0].submit(); }" value="Create" />

但一定有更好的方法！有人告诉我使用 g:remoteForm，但还没有看到一个足够完整的示例来使用 Modalbox。也许人们正在使用一个新窗口，它会像 Gmail 的撰写窗口一样自动关闭几秒钟？

这可能是一个非常普遍的场景，对于 SiteMesh 模板，或者至少是一个“渲染模板：”，甚至是像 modalBox:createLink 这样的 GSP 标签。

Gtown 项目空间中的可用资源here。

Answer 1

Modalbox 上的示例已经在灯箱中隐藏了验证错误：

Invalid Email!

所以我认为如果你想使用 Grails 验证，你将不得不采取自己控制表格。在这种情况下，灯箱插件将只负责绘制灯箱，您将提供所有表单内容。

我使用 Boxy（另一个灯箱插件，其工作方式应该与您的 Modalbox 类似），下面是我如何在灯箱中使用 Grails 验证的示例。当我创建灯箱时，我使用“shell”动作来填充它。 shell 动作渲染一个模板，模板内部是一个 ，它第一次绘制搜索表单。 调用验证操作并使用验证操作的结果重绘灯箱的内容。结果可能是成功页面或验证错误页面。

命令对象的使用，在此示例中为 SearchCommand，仅用于演示。

控制器：

def launchLightbox = {
    render template: 'lightboxFrame'
}

def lightboxContents = { SearchCommand cmd ->

    // if the search failed, re-draw the search form with validation errors
    if (cmd.hasErrors()) {
        return [cmd: cmd]
    } 

    // the search succeeded. Show the results within the lightbox
    else {
        render template: 'searchResults', model: [results: cmd.results]
    }
}

_lightboxFrame.gsp：

<g:formRemote name="searchLightbox" 
        url="[action: 'lightboxContents']" update="lightboxContentsDiv">
    <div id="lightboxContentsDiv">
        <g:include view="/yourController/_lightboxContents.gsp"/>
    </div>
</g:formRemote>

_lightboxContents.gsp：

<g:renderErrors bean="${cmd}"/>
<p>Enter your search:</p>
<g:textField name="search" value="${cmd?.search}"/>
<g:submitButton name="submitButton" value="Submit"/>

如果您想更好地控制搜索成功或失败时的操作，例如在失败时呈现验证错误或在成功时关闭灯箱，您可能需要编写自己的 javascript 回调。

Grails Remote Constraints plugin 与此问题有些相关，并且可能对您有所帮助。我已经有一段时间没有尝试过了，但是您应该能够使用它来异步重绘页面的某些部分，并使用 Grails 生成的验证错误。