gpt4 book ai didi

java - 从 JavaScript 调用托管 bean 方法以最终填充 Primefaces 对话框组件

转载 作者:行者123 更新时间:2023-11-29 22:12:23 28 4
gpt4 key购买 nike

所以我在集成普通 JavaScript 和 primefaces 对话框组件时遇到了问题。用户应该得到一个覆盖对话框(单个)作为对多个动态 JavaScript 生成的 Div 元素(多个)的点击的响应。对话框的内容应取决于用户点击的是哪个 div 元素。

模拟问题的简化结构如下:

javascript(谷歌关闭):

// this code is in a loop that creates multiple div elements
// in the page dom structure.

var iconDiv = goog.dom.createDom('div', {
'id': nodeId, // **
'class': 'icondiv',
'style': iconDivStyle // **
}, goog.dom.createDom('img', {
'src': 'layer_icons/unused.png',
'class': 'iconDivImg',
'style': 'width:100% ;position:absolute; height: auto; '
}));

goog.events.listen(iconDiv,goog.events.EventType.CLICK,function (e){
// in an ideal situation, the stringField is set to 'this.id' here ...
dlg1.show();
});

//** these are the code lines that mark the difference between the
// divs created in the loop.

primefaces 对话框:

这是当用户点击任何图标时显示的对话框组件在上面的 javascript 中创建。

<p:dialog id="DialogId" dynamic="true" widgetVar="dlg1"> 
<h:form id="formId">
<p:outputLabel id="clickedOnDiv_Id" value=" #{managedBean.stringField}"/>
<p:outputLabel id="somePropertyOfThisDiv_Id" value="#{managedBean.stringFieldSetByMethod}"/>
</h:form>
</p:dialog>

托管 Bean:

class managedBean {

private String stringField ; // getter and setter

private String stringFieldSetByMethod ; // getter and setter

public void method(){

// uses the stringField in some way to set 'stringFieldSetByMethod' ...

}

}

以上是我想实现的,如果你已经找到实现方法,请指教。

接下来是我到目前为止尝试过的:

我添加了以下 javascript 函数:

populateDialog = function(divId){
document.getElementById('formId:hiddenInput').value = divId;
document.getElementById('formId:hdnBtn').click();
}

因此 onClick 事件处理程序更改为以下内容:

goog.events.listen(iconDiv,goog.events.EventType.CLICK,function (e){
divId = this.id; // where divId is a variable accessible to populateDialog()
dlg1.show();
}); // this is inside a loop, so it is set for each created div

然后我将 populateDialog() 作为 OnShow 回调添加到对话框并将其更改为如下所示:

<p:dialog id="DialogId" dynamic="true" widgetVar="dlg1" onShow="populateDialog();">
<h:form id="formId">
<h:inputHidden id="hiddenInput" value="#{nodesBean.stringField}" />
<p:commandButton id="hdnBtn" ajax="true" actionListener="#{managedBean.method()}" style="display: none;" update=":formId"/>

<p:outputLabel id="clickedOnDiv_Id" value="#{managedBean.stringField}"/>
<p:outputLabel id="somePropertyOfThisDiv_Id" value="#{managedBean.stringFieldSetByMethod}"/>
</h:form>
</p:dialog>

结果是managedBean.method没有被调用,对话框加载时所有字段都是空的,我可以跟踪进度 JavaScript,直到调用 populateDialog(),divId 是正确的,我没有收到任何 JavaScript 错误。然而,服务器完全无能为力 关于我正在做的所有客户端驼峰和跳跃,非常感谢对实际发生的事情的解释。

提前致谢!

最佳答案

所以解决方案是使用:

在对话框中:

`<h:inputHidden id="hiddenInput" value="#{nodesBean.stringField}" />
<p:remoteCommand name="remoteCommandFunction" process="hiddenInput" update=":formId"/>`

在(每个动态创建的 div 的)onclick 处理程序中

goog.events.listen(iconDiv,goog.events.EventType.CLICK,function (e){
divId = this.id; // where divId is a variable accessible to populateDialog()
dlg1.show();
}); // this is inside a loop, so it is set for each created div

作为对话框 onshow 回调调用的 javascript 函数:

populateDialog = function(divId){
document.getElementById('formId:hiddenInput').value = divId;
remoteCommandFunction(); // this is cool cause it solves my problem, not cool cause you really have to know what you're looking for in the documentation to find it >:-/
}

最后,在托管 bean 中:

class managedBean {

private String stringField ; // getter and setter

private String stringFieldSetByMethod ; // getter and setter

public void setStringField(String sf){
this.stringField = sf;

method();
}

public void method(){

// uses the stringField in some way to set 'stringFieldSetByMethod' ...

}

}

关于java - 从 JavaScript 调用托管 bean 方法以最终填充 Primefaces 对话框组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17422718/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com