Javascript 在JSF2页面中打开JQuery对话框

Javascript 在JSF2页面中打开JQuery对话框,javascript,jquery,jsf,Javascript,Jquery,Jsf,在我的JSF页面中,当用户单击“注册”commandLink组件时,我必须在完成注册后在jQuery弹出窗口中向用户显示确认消息 我的JSF页面看起来像 <h:commandLink value="Register" p:data-role="button" > <f:ajax execute="@form" listener="#{userController.registerUser(event)}" onevent="function(d

在我的JSF页面中,当用户单击“注册”commandLink组件时,我必须在完成注册后在jQuery弹出窗口中向用户显示确认消息

我的JSF页面看起来像

<h:commandLink value="Register" p:data-role="button" >
    <f:ajax execute="@form" listener="#{userController.registerUser(event)}" 
            onevent="function(data){if(data.status==='success')
            {
           openDialogFunc();
            }}" />
</h:commandLink>

<div data-role="popup" id="register-dialog" data-theme="a" data-overlay-theme="a">  

    <div data-role="header" data-tap-toggle="false">
        <h1>Success</h1>
    </div>

    <div data-role="content">
        <br/>
        <p>Your user account has now been created.</p>
        <br/>
        <h:commandButton value="Login" p:data-role="button" action="#{userController.Login}"/>
    </div>

</div>

成功

您的用户帐户现在已创建


openDialogFunc的定义如下:

function openDialogFunc() {
    $("<a />").attr({
        "href": "#register-dialog",
        "data-rel": "popup",
        "data-position-to": "window",
        "data-theme": "a"
    }).click();

}
函数openDialogFunc(){
$("它可以用来将外部页面从bean启动到对话框中。是否可以使用相同的框架动态启动或启动到对话框中?

只需使用基于jQuery的JSF组件库,例如。它有一个用于特定用途的
组件,而无需编写/编写所有HTML/JS样板文件每次都是e代码

展示当前与PrimeFaces 4.0兼容的代码,以下是与PrimeFaces 3.5兼容的标记(请注意,
,这在PrimeFaces 4.0中也适用,但不知何故,他们更愿意展示如何使用新的
PF()
函数):


...
您的用户帐户现在已创建

另见:

为什么不使用基于jQuery的JSF组件库,如PrimeFaces?它有一个用于特定目的的
组件,而无需您每次都编写/编写所有HTML/JS样板代码。@BalusC这真是一个很棒的信息。请查看我更新的问题。showcase当前正在运行4.0快照,目前仍处于alpha阶段。您可以在《用户指南》中找到合适的PF 3.5示例:
<p:commandButton id="basic" value="Basic" onclick="PF('dlg1').show();" type="button" />
<p:commandButton id="basic" value="Basic" onclick="dlg1.show();" type="button" />  
<h:form>
    ...
    <p:commandLink value="Register" action="#{user.register}" oncomplete="w_confirm.show()" />
</h:form>

<p:dialog widgetVar="w_confirm" header="Success">
    <h:form>
        <p>Your user account has now been created.</p>
        <p><p:commandButton value="Login" action="#{user.login}" oncomplete="w_confirm.hide()" /></p>
    </h:form>
</p:dialog>