JGrowlFeedbackPanel 选项无法正常工作答案

【问题标题】：JGrowlFeedbackPanel options don't work properlyJGrowlFeedbackPanel 选项无法正常工作
【发布时间】：2013-11-22 08:46:52
【问题描述】：

我正在尝试在我的项目中使用 JGrowlFeedbackPanel 组件。这是 JGrowl 插件 (JQuery) 的检票口采用。我从一个 Maven 的存储库中得到它。

ResourceReference cssMenuRef = new ResourceReference(HomePage.class, "style_menu.css");
add(CSSPackageResource.getHeaderContribution(cssMenuRef));

JGrowlFeedbackPanel feedbackPanel = new JGrowlFeedbackPanel("feedbackPanel", new ErrorLevelFeedbackMessageFilter(FeedbackMessage.WARNING));
add(feedbackPanel);
Options errorOptions = new Options();
errorOptions.set("header", "Error"); //works
errorOptions.set("sticky", true); //works
errorOptions.set("position", "center"); //doesn't work
errorOptions.set("theme", "feedback"); //doesn't work
error("TEST!");
feedbackPanel.setErrorMessageOptions(errorOptions);

.feedback {
color: #ff0000;
background-color: #FFFFFF !important ; 
width: 400px;
}

我想改变 jGrowl 的默认位置和颜色，但它们根本没有改变。我可以在我的 css 文件中使用 !important 声明，但我认为这不是一个好主意。我将不胜感激任何建议。谢谢！

【问题讨论】：

标签： wicket jgrowl

【解决方案1】：

对于这个职位，jGrowl 在其文档中明确表示：

必须在启动方法之前更改默认值调用。

链接：jGrowl

-> 根据我在这里找到的源代码： JGrowlFeedbackMessage.java 和这里： JGrowlFeedbackPanel.java 这可能无法正常工作，因为您必须进入“jquery.jgrowl.js”内部才能修改位置默认值...

另外我不明白为什么 jGrowl 选项不能在 JS 中完全扩展。

也许更好的建议是使用 jquery 通知程序，构建您自己的面板并包装调用以通过 target.appendJavaScript() 方法触发通知。 wicket6 示例：

    public void showExpiringNotification(final String title, final String message, final int expiringSpeed) {
      AjaxRequestTarget target = RequestCycle.get().find(AjaxRequestTarget.class);
      if (target != null) {
        target.appendJavaScript("$('#container').notify('create','error',{title: '" + title + "', text: '" + message
                + "' },{expires: " + expiringSpeed + "})");
      }
    }

如果需要，我可能会在我的博客上提供更详细的示例...

【讨论】：

【解决方案2】：

当我与 WicketStuff 的 jGrowl 面板集成后，我今天注意到了两件事。

它总是错过我的第一条消息，除非我在页面上显示任何反馈消息之前先调用 $.jGrowl()。这仅在 IE10 中受到影响，请参阅https://github.com/stanlemon/jGrowl/issues/17
如果您将选项作为字符串传递，它附带的选项类喜欢在选项周围加上单引号。因此，请确保使用 new Interger(x) 或其他类型的对象。

否则这是一个不错的 UI 添加。

【讨论】：