Question

我正在Vaadin开发一个Web应用程序，它涉及大量表单。目前，所有屏幕都已创建，我将它们运行到几个测试用户（4）以检查其可用性。所有人都有同一个评论;当发生验证错误时，不清楚问题是什么。他们都没有想过将鼠标悬停在错误指示器上（如果他们甚至注意到指示器）以获得准确的错误消息。

我在Vaadin书中读到，错误指示符的位置由包含组件的布局管理。但是，它似乎没有说明直接显示错误消息。是否可以这样做（最好不必实现自定义小部件集）？

谢谢，

威廉

Answer 1

我不认为你的想法是用vaadin的基本组件实现的。

我建议采用以下方法：在表单的输入组件上方创建一个专用标签，默认情况下是不可见的。验证后，如果有错误，请将它们全部添加到标签的文本中并使其可见。显示导致验证错误的组件旁边的错误可能会使您的布局过于混乱。

Answer 2

我写了一个实用程序类来执行此操作：

import java.util.ArrayList;
import java.util.Collection;
import java.util.List;

import org.apache.commons.lang3.StringUtils;

import com.vaadin.server.ErrorMessage;
import com.vaadin.server.Page;
import com.vaadin.ui.AbstractComponent;
import com.vaadin.ui.Notification;
import com.vaadin.ui.Notification.Type;

public class ErrorUtils {
    public static List<String> getComponentError(
            final AbstractComponent[] componentArray) {
        List<String> errorList = new ArrayList<String>();

        for (AbstractComponent component : componentArray) {
            ErrorMessage errorMessage = component.getErrorMessage();
            if (errorMessage != null) {
                errorList.add(errorMessage.getFormattedHtmlMessage());
            }
        }

        return errorList;
    }

    public static List<String> getComponentError(
            final Collection<?> componentCollection) {
        AbstractComponent[] componentArray = componentCollection
                .toArray(new AbstractComponent[] {});
        return ErrorUtils.getComponentError(componentArray);
    }

    public static void showComponentErrors(
            final AbstractComponent[] componentArray) {
        List<String> errorList = ErrorUtils.getComponentError(componentArray);

        String error = StringUtils.join(errorList, "\n");

        Notification notification = new Notification("Error", error,
                Type.ERROR_MESSAGE, true);

        notification.show(Page.getCurrent());
    }

    public static void showComponentErrors(
            final Collection<?> componentCollection) {
        AbstractComponent[] componentArray = componentCollection
                .toArray(new AbstractComponent[] {});

        ErrorUtils.showComponentErrors(componentArray);
    }
}

以下代码是一个简单的示例，展示了如何使用它：

private void saveButtonClicked() {
    // this method is the handler of the click event of the [save] button

    try {
        this.fieldGroup.commit();
    } catch (CommitException e) {
        // Show all the validate errors:
        ErrorUtils.showComponentErrors(this.fieldGroup.getFields());

        return;
    }

    // save data, if there is no validate error
}

Answer 3

我创建了一个Vaadin插件，它将直接在UI上显示验证/转换错误消息，而不是在工具提示中。

在这里查看： https://vaadin.com/directory#!addon/validation-error-display

直接在Vaadin 7中显示错误消息

3 个答案: