Jsf 如何将咆哮与'；位置：粘性'；面对面？_Jsf_Primefaces

Jsf 如何将咆哮与'；位置：粘性'；面对面？

jsf primefaces

Jsf 如何将咆哮与'；位置：粘性'；面对面？,jsf,primefaces,Jsf,Primefaces,我正试图通过.ui growl类更改primefaces的p:growl位置，以使用位置：sticky。但是，由于该组件在body中的末尾渲染，因此该位置的相对行为不能像我所希望的那样工作是否有任何方法可以使用此组件的粘性位置？或者以某种方式使组件在声明的位置呈现第5.1条；莫哈拉2.1 Disclamer：我在PF 7.0 showcase上试过，但我认为基本功能也适用于5.1版本你实际上有4个选择。后三种方法都需要您检查（它是开放的，因此您可以在提问之前始终检查它，这里与此无关），

我正试图通过

.ui growl

类更改primefaces的

p:growl

位置，以使用

位置：sticky

。但是，由于该组件在

body

中的末尾渲染，因此该位置的

相对

行为不能像我所希望的那样工作

是否有任何方法可以使用此组件的

粘性

位置？或者以某种方式使组件在声明的位置呈现

第5.1条；

莫哈拉2.1

Disclamer：我在PF 7.0 showcase上试过，但我认为基本功能也适用于5.1版本

你实际上有4个选择。后三种方法都需要您检查（它是开放的，因此您可以在提问之前始终检查它，这里与此无关），对于第一种解决方案，它有助于查看组件的工作方式，但使用浏览器开发人员工具检查就足够了（我就是这样做的）

基本分析，无论是否查看来源这是“或以某种方式使组件在声明位置呈现”的变体。由于在客户端，它都是纯html、css和javascript，因此您可以使用客户端可用的所有工具进行操作

您可以看到，grow的主要部分是在声明的地方从技术上呈现的html。查看PrimeFaces showcase，您将看到

<span id="j_idt700:growl" class="ui-growl-pl" data-widget="widget_j_idt700_growl" data-summary="data-summary" data-detail="data-detail" data-severity="all,error" data-redisplay="true"></span>

并添加了以下css

position: sticky;
top: 10px;
float: right; // this is needed in the showcase, might not always be needed

它成功了

jquery应该放在页面的某个地方，在执行组件javascript之后运行，所以最好在正文结束之前执行。请记住，

j_idt700

前缀是showcase中表单的动态id（此处没有固定id），但您也可以根据类或其他内容使用不同的选择器）

解决方案2，更改“本地”源在中，可以看到容器的技术渲染位置

render: function() {
    //create container
    this.jq = $('<div id="' + this.id + '_container" class="ui-growl ui-widget"></div>');
    this.jq.appendTo($(document.body));

    //render messages
    this.show(this.cfg.msgs);
},

render:function（）{
//创建容器
this.jq=$（''）；
这个.jq.appendTo（$（document.body））；
//呈现消息
this.show（this.cfg.msgs）；
},

将

this.jq.appendTo（$（document.body））

以某种方式将其附加到当前html节点（“this”？）也会使其正常工作。关于覆盖，您有两个选择

解决方案3更改源服务器端实际上，您完成了#2的第一部分，但修补了源代码并创建了一个新的自定义PrimeFaces版本

解决方案4使其他人也可以使用此功能

这里可以做的是在组件上创建一个新属性，并在某些地方修补源代码，这样就可以配置组件，使其保持现在的状态或粘性（在7.0.x中，他们将现有的“粘性”属性更改为“keepAlive”，以便粘性再次可用；-））。当然，这应该作为补丁提交，然后…

Disclamer：我在PF 7.0 showcase中尝试了这一点，但我认为基本功能也适用于5.1版本