Jsf 多次调用fileUpload事件

Jsf 多次调用fileUpload事件,jsf,file-upload,primefaces,Jsf,File Upload,Primefaces,使用PrimeFaces fileUpload控件上载文件时出现问题 问题是当我上传文件时,上传事件被调用了4次 我找不到明确的理由 这是我的xhtml页面: <?xml version='1.0' encoding='UTF-8' ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&

使用PrimeFaces fileUpload控件上载文件时出现问题

问题是当我上传文件时,上传事件被调用了4次

我找不到明确的理由

这是我的xhtml页面:

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets">
    <h:head>
    </h:head>
    <h:body>

        <ui:composition template="home.xhtml">

            <ui:define name="content">

                <script type="text/javascript">
                    function callChangeImage(){
                        alert('completed');
                        var hiddenLink = document.getElementById('mainForm:hiddenLink');
                        hiddenLink.click();                
                    }
                    function callDeleteImageFromTemp(){
                        alert('started');
                        updated = false;
                        var hiddenLink2 = document.getElementById('mainForm:hiddenLink2');
                        hiddenLink2.click(); 
                    }
                </script>

                <p>
                    <p:commandButton value="Agregar Noticia" update="newsTable, display" icon="ui-icon-circle-plus" actionListener="#{newsBean.addNew}" oncomplete="newDialog.show()"/>                                  
                    <p:commandButton value="Editar Noticia" oncomplete="editNewDialog.show()" icon="ui-icon-pencil"/>
                    <p:commandButton value ="Eliminar Noticia" icon="ui-icon-trash" onclick="dlgDelete.show()" />                            
                </p>

                <p:scrollPanel>
                    <p:dataTable var="unew" value="#{newsBean.news}" rowKey="#{unew.id}" 
                                 selection="#{newsBean.selectedNew}" selectionMode="single" id="newsTable">  

                       <p:ajax event="rowSelect" update=":mainForm:display" />

                       <f:facet name="header">  
                            Lista de noticias  
                        </f:facet>  


                        <p:column headerText="Numero" sortBy="#{unew.id}" filterBy="#{unew.id}" id="id">  
                            #{unew.id}  
                        </p:column>

                        <p:column headerText="Titulo" sortBy="#{unew.title}" filterBy="#{unew.title}" id="title">  
                            #{unew.title}  
                        </p:column>

                        <p:column headerText="Descripcion" sortBy="#{unew.description}" filterBy="#{unew.description}" id="description">  
                            #{unew.description}  
                        </p:column>

                        <p:column headerText="Enlace" sortBy="#{unew.link}" filterBy="#{unew.link}" id="link">  
                            #{unew.link}  
                        </p:column>

                        <p:column headerText="Imagen" sortBy="#{unew.img}" filterBy="#{unew.img}" id="img">  
                            #{unew.img}  
                        </p:column>

                    </p:dataTable> 
                 </p:scrollPanel> 

                 <p:dialog widgetVar="dlgDelete" header="Desea eliminar la noticia #{newsBean.selectedNew.id}?">
                     <p:panel style="text-align: center">
                        <p:commandButton value="Si" update="newsTable" action="#{newsBean.removeNew}"  oncomplete="dlgDelete.hide()" />
                        <p:commandButton value="No" onclick="dlgDelete.hide()" type="button" />
                    </p:panel>
                 </p:dialog>

                 <p:dialog header="Editar Noticia" widgetVar="editNewDialog" resizable="false"  
                           showEffect="explode" hideEffect="explode" onHide="">  

                    <p:ajax event="close" listener="#{fileUploadBean.deleteFileFromTemp}" update="messages"/>  
                    <p:ajax event="close" listener="#{newsBean.deleteImageFromTemp}" update="messages"/>  

                    <h:panelGrid id="display" columns="2" cellpadding="4">  

                        <f:facet name="header">                                                                             
                            <p>Noticia #{newsBean.selectedNew.id}</p>                       
                            <p>
                                <p:commandLink id="editImage">
                                    <p:graphicImage id="imageNew" value="/temp/#{newsBean.selectedNew.img}" />
                                </p:commandLink>
                                <p:overlayPanel id="editImagePanel" for="editImage" hideEffect="fade">                               
                                    <table cellpadding="5px">
                                        <tr>
                                            <td>
                                            <p:commandButton title="Eliminar Imagen" update="imageNew" actionListener="#{newsBean.removeImage}" icon="ui-icon-trash"/>                                   
                                            </td>
                                            <td>
                                            <p:fileUpload 
                                                    fileUploadListener="#{fileUploadBean.handleFileUpload}"  
                                                    mode="advanced"                                                     
                                                    sizeLimit="1000000"   
                                                    allowTypes="/(\.|\/)(gif|jpe?g|png)$/"
                                                    cancelLabel="Eliminar"
                                                    uploadLabel="Subir"                                                  
                                                    label="Buscar..."
                                                    dragDropSupport="false"
                                                    oncomplete="callChangeImage();"
                                                    onstart="callDeleteImageFromTemp();"
                                                    auto="true">                                              
                                            </p:fileUpload>
                                            <p:commandLink id="hiddenLink" action="#{newsBean.changeImage(fileUploadBean.uploadedFile.fileName)}" style="display:none" update="imageNew"/>
                                            <p:commandLink id="hiddenLink2" action="#{newsBean.deleteImageFromTemp}" style="display:none"/>
                                            </td>
                                        </tr>
                                    </table>
                                </p:overlayPanel>
                            </p>              
                        </f:facet>



                        <h:panelGrid id="display2" columns="2" cellpadding="4">  
                            <h:outputText value="Titulo:" />  
                            <p:inputTextarea rows="1" cols="60" value="#{newsBean.selectedNew.title}" id="title"/>  

                            <h:outputText value="Descripcion:" />  
                            <p:inputTextarea rows="6" cols="60" value="#{newsBean.selectedNew.description}" id="description"/>  

                            <h:outputText value="Enlace:" />  
                            <p:inputTextarea rows="1" cols="60" value="#{newsBean.selectedNew.link}" id="link"/> 
                        </h:panelGrid>


                         <f:facet name="footer">  
                             <p:commandButton value="Guardar" update="newsTable" actionListener="#{newsBean.saveNewEdit}" oncomplete="newDialog.hide()">
                                 <p:ajax listener="#{fileUploadBean.writeUploadedFile('/images/news/', newsBean.selectedNew.id)}" update="messages"/>  
                             </p:commandButton>
                        </f:facet> 

                    </h:panelGrid>  
                </p:dialog> 



            </ui:define>

        </ui:composition>

    </h:body>
</html>
如果执行此页面并尝试上载文件,则函数“beforeUpload”和“afterUpload”中的javascript“警报”将显示4次

这导致图像中出现闪烁,并随文件上载而更新

我会感谢任何人的帮助,因为我有点被这个绊倒了

谢谢你的帮助

一点背景: 本页的目的是添加新闻(用于个性化新闻阅读器)。 在此页面中有一个包含新闻的表格,每次选择新行时,都会出现一个对话框来编辑新行

在这个对话框中,你有新的和其他东西的图像

目标是在编辑器中单击图像时,会出现一个覆盖面板,其中包含上载新图像或删除当前图像的选项

标题为“Eliminar Imagen”的commandButton将删除新文档的图像。 fileUpload为新文件上载新图像。
因此,它们都应该在前端编辑器对话框中更新新的映像。

在JSF生命周期中,在以下阶段多次调用操作侦听器:

Apply request values phase; **process events**

Process validations phase; **process events**

Update model values phase; **process events**

Invoke application phase; **process events**

请花一些时间来最小化代码,并删除所有使示例混乱的不相关部分。最可能的情况是,您通过单击多次提交页面。我认为一个来自fileUpload组件的actionListener属性,另一个来自commandButton的操作。尝试移除其中一个。如果不是这样,请解释你的行为。嗨!谢谢你的回答。我正在更新这篇文章,并提供更多的解释。我不能减少代码,因为如果是这样的话,没有什么是可以理解的。
Apply request values phase; **process events**

Process validations phase; **process events**

Update model values phase; **process events**

Invoke application phase; **process events**