You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何让Vaadin 14 Crud编辑器验证不通过时点击保存不关闭

Vaadin 14 Crud编辑器验证失败时保持打开的解决方案

问题核心是默认Crud的保存逻辑会在执行完监听器后强制关闭编辑器,完全忽略Binder的验证结果。要解决这个问题,需要手动控制编辑器的关闭时机,仅在验证通过后才执行关闭操作。

具体修改步骤:

  1. 替换默认保存监听器逻辑
    不要直接调用无返回值的保存方法,而是在监听器内先触发Binder的完整验证,根据验证结果决定后续操作:
// 替换你原有的保存监听器代码
crud.addSaveListener(e -> {
    // 获取编辑器绑定的Binder实例
    Binder<Account> binder = ((BinderCrudEditor<Account>) crud.getEditor()).getBinder();
    // 触发所有已配置的验证规则
    ValidationResult validationResult = binder.validate();
    
    if (validationResult.isOk()) {
        // 验证通过,执行业务保存逻辑
        saveAccount(e.getItem());
        // 手动关闭编辑器
        crud.editItem(null);
    } else {
        // 验证失败,保持编辑器打开
        // 可选优化:自动聚焦到第一个验证失败的字段,提升用户体验
        binder.getFields().stream()
                .filter(field -> binder.getValidationStatus(field).isError())
                .findFirst()
                .ifPresent(Component::focus);
    }
});
  1. 检查自定义Crud的逻辑
    如果你自定义的增强Crud类重写了保存相关方法,确保其中没有强制关闭编辑器的代码,把关闭逻辑完全交给上面的监听器控制。

  2. 利用现有Binder验证配置
    你已经给Binder配置了asRequired和多个自定义验证器,binder.validate()会自动触发所有规则并弹出对应的警告消息,无需额外处理提示逻辑。

原理说明:

默认Vaadin Crud的保存流程是「执行保存监听器 → 自动关闭编辑器」,通过手动接管验证和编辑器关闭逻辑,我们可以在验证失败时跳过关闭步骤,让编辑器保持打开状态,用户修正错误后可直接再次提交。

内容的提问来源于stack exchange,提问作者Muhammet Kurt

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.19 12:37:14