如何使用JQuery在JSF 2中打开Modal弹出窗口

我有一个要求,在我的JSF页面中会有一个commandButton,并且在点击该commandButton时它将触发一个动作方法,该方法将执行一些逻辑并根据该逻辑的结果我将必须显示弹出两个commandButton在上面。 我不能使用JSF的任何实现(如RichFaces,IceFaces),我需要使用JSF 2和JQuery来实现这一点。 可能吗? 任何想法或想法对我都非常有帮助。 哦,另外一件事我需要在几个页面中添加按钮和相同的逻辑。 我尝试过使用SimepleModal插件,但没有成功提出一个聪明的方法。

这是一个完整的工作示例

我使用display:none来隐藏h:panelGroup对话框容器,因为.dialog函数会在需要时使其可见

您还可以隐藏真正的jsf命令按钮,并通过带有jquery#selector的对话框按钮访问它,并像在js文件中一样调用.click。

最后一件事,使用onclick="initDialog(); return false;" 调用对话框js函数并添加return false,这样命令按钮就不会试图导航……

通过使用jQuery UI对话框,您将获得对对话框的最大灵活性/控制。

该示例包含2个文件(一个.xhtml和一个.js),

我使用了jQuery和jQueryUI,根本不需要任何其他插件

的index.xhtml

                  

和scripts.js

 function initDialog() { $("#idOfDialogPlaceHolder").dialog({ modal: true, buttons: { SomeButton: function () { $("#justAButton").click(); }, Close: function () { $(this).dialog("close"); } }, }); } 

而已