PrimeFaces第二个对话框窗口无法从第一个对话框打开

时间:2013-05-30 14:17:16

标签: jsf-2 primefaces

尝试从第一个对话框打开第二个对话框时出现问题。第一个对话框打开正常,但第二个对话框似乎根本没有打开。我已尝试使用对话框内外的表单标记,但似乎都没有打开对话框。从第一个单击OPEN对话框按钮似乎没有任何结果。我正在使用PrimeFaces 3.5。

对话框的代码如下

<p:dialog id="dialog" header="New Submission" widgetVar="dlg" resizable="false" modal="true" closable="true">  
        <h:form id="createDialogForm">
        <h:panelGrid columns="2" cellpadding="5">  
            <h:outputLabel for="projectDropDown" value="Project:" />  
            <h:selectOneMenu id="projectDropDown" value="#{newSubmissionBean.submission.project}"  required="true">
                <f:selectItem itemLabel="Choose project" noSelectionOption="true" />
                <f:selectItems value="#{newSubmissionBean.projectEntities}" var="project" itemLabel="#{project.name}" itemValue="#{project}" />
            </h:selectOneMenu>


            <f:facet name="footer">  
                <p:commandButton id="createButton" value="Create" update=":newSubmissionForm :createDialogForm"   
                    actionListener="#{newSubmissionBean.createSubmission}" 
                    oncomplete="handleRequest(xhr, status, args)"
                    />

                <p:commandButton id="chooseBatchButton" value="OPen dialog" update=":batchChooserForm"   
                    actionListener="#{newSubmissionBean.fetchAvailability}" />  
            </f:facet>  
        </h:panelGrid>  
          </h:form>
        </p:dialog>  






        <p:dialog id="batchDialog" header="Batch Chooser" widgetVar="bdlg" resizable="false" modal="true" closable="true">
        <h:form id="batchChooserForm"> 
            <p:fieldset legend="#{messages['label.legend.sample.available']}">  
                <p:dataTable id="availableSamples" var="sample" value="#{newSubmissionBean.availableSamples}">  
                    <p:column style="width:20px">  
                        <h:outputText id="dragIcon"  
                            styleClass="ui-icon ui-icon-arrow-4" />  
                        <p:draggable for="dragIcon" revert="true" />  
                    </p:column>  

                    <p:column headerText="#{messages['label.sample.batch']}">  
                        <h:outputText value="#{sample.sampleId}" />  
                    </p:column>  



                </p:dataTable>  
            </p:fieldset>  

            <p:fieldset id="selectedSamples" legend="#{messages['label.legend.sample.selected']}" style="margin-top:20px">  
                <p:outputPanel id="dropArea">  
                    <h:outputText value="#{messages['label.drop.text']}"  
                            rendered="#{empty newSubmissionBean.selectedSamples}"  
                            style="font-size:24px;" />  

                    <p:dataTable var="sample" value="#{newSubmissionBean.selectedSamples}"   
                            rendered="#{not empty newSubmissionBean.selectedSamples}">  

                        <p:column headerText="#{messages['label.sample.batch']}">  
                            <h:outputText value="#{sample.sampleId}" />  
                        </p:column>  


                        <!-- p:column style="width:32px">  
                            <p:commandButton update=":carForm:display"  
                                    oncomplete="carDialog.show()"  
                                    icon="ui-icon-search">  
                                <f:setPropertyActionListener value="#{car}"  
                                    target="#{tableBean.selectedCar}" />  
                            </p:commandButton>  
                        </p:column-->  
                    </p:dataTable>  
                </p:outputPanel>  
            </p:fieldset> 

            <p:commandButton id="confirmBatch" value="Confirm Selection" update=":newSubmissionForm :createDialogForm"   
                    actionListener="#{newSubmissionBean.confirmSelection}" 
                    oncomplete="handleRequest(xhr, status, args)"/> 

            <p:droppable for="selectedSamples" tolerance="touch" activeStyleClass="ui-state-highlight" datasource="availableSamples" onDrop="handleDrop">  
                <p:ajax listener="#{newSubmissionBean.onSampleDrop}" update="dropArea availableSamples" />  
            </p:droppable> 
            </h:form>
        </p:dialog>

完成时的javascript函数是

    <script type="text/javascript">  
    function handleRequest(xhr, status, args) {  
        if(args.validationFailed) {  
            dlg.show();

        }   
        else {  
            dlg.hide(); 

        }  
    }  
</script> 

动作监听器中的代码,我尝试打开第二个对话框。这个方法确实被调用,因为我已经指出了它。

public void fetchAvailability(ActionEvent actionEvent) {

    RequestContext.getCurrentInstance().execute("batchDialog.show()");
}

有谁能告诉我做错了什么?提前致谢

2 个答案:

答案 0 :(得分:0)

您正在使用javascript中对话框的ID,您需要使用widgetVar:

public void fetchAvailability(ActionEvent actionEvent) {
    RequestContext.getCurrentInstance().execute("bdlg.show()");
}

为了将来的调试,请尝试在Web浏览器控制台中执行javascript。在这种情况下,它应该说“batchDialog未定义”或类似的东西,给你一个提示。

答案 1 :(得分:0)

好的,如果有人有同样的事情,那就找出问题所在。 Primefaces展示示例代码尚未定义handlerop javascript函数,因此抛出了对象未定义的错误。所以我在代码中添加了以下内容,现在我的弹出窗口显示出来了。

function handleDrop(event, ui) {
        var selectedSample = ui.draggable;          
        selectedSample.fadeOut('fast');
    }

由于