如何在文本框上以编程方式设置css错误样式

为什么我无法将自定义CSS样式应用于单个文本框？如何在文本框上以编程方式设置css错误样式

我想在单个文本框上设置一些错误样式。以下实现有什么问题？

初始化：

static final String STYLES = ErrorRes.INSTANCE.css().style(); 

@UiField TextBox box; 
box.setStylePrimaryName(STYLES);

资源接口

interface ErrorRes extends ClientBundle { 
    static final ErrorRes INSTANCE = GWT.create(ErrorRes.class); 

    @Source("Error.css") 
    Style css(); 

    interface Style extends CssResource { 
     @ClassName("gwt-TextBox-error") 
     String style(); 
    } 
}

Error.css

.gwt-TextBox-error { 
    border: 1px solid red !important; 
}

来源

2013-03-12 membersound

我不确定这是对的：'box.setStylePrimaryName（STYLES）;'。我在几个月前使用GWT，并且记得[setStylePrimaryName]（http://google-web-toolkit.googlecode.com/svn/javadoc/latest/com/google/gwt/user/client/ui/UIObject.html# setStylePrimaryName％28java.lang.String％29）也更新相关样式，因为您正在设置基本样式而不是错误样式。第二张纸条上，你是否检出了生成的HTML？它可能会给你更多关于这个问题的提示。 – ThanksForAllTheFish 2013-03-12 11:43:07

我在代码中尝试了你的情况，它工作的很好。查看我的更新。 – FFire 2013-03-13 00:02:52

如果whant获得小部件GWT-文本框错误样式名称，你需要设置box.setStylePrimaryName("gwt-TextBox"); - 这是默认设置。当错误发生时使用box.setStyleDependentName("error", true); HTML将为class =“gwt-TextBox gwt-TextBox-error”。并清除错误的风格，使用box.setStyleDependentName("error", false);

您可以在同样的方式使用addStyleName("gwt-TextBox-error")和removeStyleName("gwt-TextBox-error")。

--- UPDATE ---

所以，我tryed你的情况下运行，效果很好。在首先你需要从资源注入的CSS页面在运行时：

ErrorRes.INSTANCE.css().ensureInjected();

我用它在onModuleLoad()

开始时接着，添加错误风格用途：box.addStyleName(STYLES); 和box.removeStyleName(STYLES);将其删除。

您不能使用配对setStylePrimaryName()和setStyleDependentName()与捆绑的css becouse css名称将被混淆。

来源

2013-03-12 14:26:29 FFire

如果我把''gwt-TextBox-error“'css类放在我的主css文件中，你的第二个选项完美地工作。但我想为错误样式有一个单独的css文件。此外，我不想使用带有addStyleName（“gwt-TextBox-error”）的字符串文字，而是从上面写的ErrorRes.INSTANCE中获取css类名称。无论如何使用'addStyleName（STYLES）'不起作用。我的ClientBundle有什么问题吗？ – membersound 2013-03-12 15:08:19

如何在文本框上以编程方式设置css错误样式

回答

相关问题