在JSF 1.2中使用Jquery-UI-Dialog

Question

我正在尝试在jsf项目中使用jquery。我想打开一个jquery对话框。对话框正在打开，可以执行我们想要的操作。但是当它关闭时，richfaces选项卡不起作用。当我删除

<script type="text/javascript"
            src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js"></script>
        <script type="text/javascript"
            src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.js"> </script>

此话他们又开始工作了。

下面是firebug

的错误输出

Error: element.dispatchEvent is not a function
Source File: http://localhost:8080/KOBAR/a4j/g/3_3_3.Finalorg.ajax4jsf.javascript.PrototypeScript
Line: 265

这是我的.xhtml页面。

<ui:define name="head">
        <script type="text/javascript"
            src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js"></script>
        <script type="text/javascript"
            src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.js"></script>
        <f:verbatim>
            <script type="text/javascript">
            function openStakeHolderPopUp(){
                //$('#stakeHolderPopUp').dialog('open');
                    var popUpWindow = document.getElementById("stakeHolderPopUp");
                    popUpWindow.setAttribute("style", "visibility:visible");
                    $(popUpWindow).dialog({
                        modal: true,
                        height: 100,
                        width: 200,
                        closeOnEscape: true,
                        close: function(ev, ui) { 
                            $(this).dialog("destroy");
                        }
                    });
                };
            </script>
        </f:verbatim>
    </ui:define>
    <ui:define name="body">
       <RF:tabPanel>
    <RF:tab label="Profil" id="tabProfil">
            <h:inputText id="value" readonly="true" onclick="openStakeHolderPopUp()"/>
            <h:inputText id="name" required="true" value="#{company.name}"/>
            </RF:tab>
    <RF:tab label="Detay" id="tabDetail">
            </RF:tab>

    <RF:panel id="stakeHolderPopUp">
    <ui:define name="label">Paydaş Adı</ui:define>
      <h:inputText id="value" required="true"/>
    </RF:panel>
    </ui:define>

任何想法?谢谢。

Answer 1

RichFaces 3.3.3附带了它自己的jQuery版本，我相信是1.3.x。它可能与您手动包含的jQuery 1.6.2发生冲突。您可以尝试以下操作:

• 不包含jQuery 1.6.2，只使用richfaces提供的jQuery库。如有必要，将jQuery UI更改为1.3。

• 或者直接使用<rich:modalPanel>代替jQuery UI对话框