Primefaces - 对话框中的CommandButton正在刷新页面

Question

在对话框中单击命令按钮后，所有页面都正在重新加载，但我不想重新加载所有页面，只有一个组件。 的对话框时，文件上传的事件展开表演，并从豆打开的对话框：

RequestContext.getCurrentInstance().execute("openCropImageDialog('artistImageCropperDialog',"+this.MAX_SIZE_PX+");"); 

这是对话部分的代码：

<composite:implementation> 

     <h:panelGroup layout="block" styleClass="links"> 
      <h:panelGroup id="imageCropperDialog" layout="block" styleClass="hidden"> 
       <h:form id="imageCropperForm"> 
        <p:imageCropper id="cropperImage" value="#{cc.attrs.croppedImage}" 
           image="/upload/#{cc.attrs.imageTmp}" 
           initialCoords="#{cc.attrs.initialCoords}" 
           aspectRatio="1" 
           minSize="#{cc.attrs.minSize}" 
           /> 
        <h:commandButton id="acceptButton" action="#{cc.attrs.acceptCropAction}" styleClass="hidden"> 
         <f:ajax execute="@form" render="@form :messages :form:pictureHandler:updatableElements" onevent="onAcceptCropEvent"/> 
        </h:commandButton> 

        <h:commandButton id="cancelButton" action="#{cc.attrs.cancelCropAction}" styleClass="hidden"> 
         <f:ajax execute="@this" render="@form :messages"/> 
        </h:commandButton> 


       </h:form> 
      </h:panelGroup> 
     </h:panelGroup> 
    </composite:implementation> 

和之后按Acept命令按钮对话框我只想刷新显示裁剪图像的图像，而不是重新加载所有页面。 你能帮我了解为什么页面被重新加载了吗？

注：该代码接受行动：

public void cropImage(){ 
    try { 
     if(croppedImage!=null){ 
      // Remove the old picture and add the new one 
      this.entity.getPictures().clear(); 
      this.entity.getPictures().add(newPicture); 
      this.newPictures.add(newPicture); 
      int x=getOriginalSize(croppedImage.getLeft()); 
      int y=getOriginalSize(croppedImage.getTop()); 
      int width = getOriginalSize(croppedImage.getWidth()); 
      int height = getOriginalSize(croppedImage.getHeight()); 
      BufferedImage bImage = ImageIO.read(cropInputStream); 
      BufferedImage selectedImage = bImage.getSubimage(x, y, width, height); 
      OutputStream os = new ByteArrayOutputStream(); 
      ImageIO.write(selectedImage, newPicture.getType().name().toLowerCase(), os); 
      InputStream newIS = new ByteArrayInputStream(((ByteArrayOutputStream) os).toByteArray()); 
      int length = ((ByteArrayOutputStream) os).toByteArray().length; 
      this.pictureController.createOrUpdateCompress(newPicture, newIS, length,true); 
     } 

    } catch (Exception e) { 
     addFacesMessage(FacesMessage.SEVERITY_ERROR, MessageKeys.GENERIC_ERROR_IMAGEPROCESSING, 
       newPicture.getFileName(), newPicture.getType().name(), e.getMessage()); 
     this.newPictures.remove(newPicture); 
    } 
} 

我已经解决了最初的问题，纠正javscript代码，并取消注释AJAX标签的一些错误。 现在的问题是，对话框只显示第一次，下一次，对话框不被操作。没有错误，也没有例外。

Answer 1

只要检查你的html错误日志（在铬它是在检查元素中可用），它似乎是产生任何JavaScript错误，导致按钮提交整个页面。

Answer 2

为什么你评论ajax？尝试这个。

<h:commandButton id="acceptButton" action="#{cc.attrs.acceptCropAction}" styleClass="hidden"> 
     <f:ajax execute="@form" render=":cropperImage" onevent="onAcceptCropEvent"/> 

</h:commandButton> 

Answer 3

原始

您是否尝试过使用属性AJAX =假？

---

编辑

好吧，我在这里改变我的回答，以便它可以看到更清晰的解决办法是简单地从渲染什么，但允许支持bean来执行更新避免命令按钮。在那里，你可以做这样的事情

<h:commandButton id="acceptButton" action="#{cc.attrs.acceptCropAction}" 
styleClass="hidden" value="#{cc.attrs.acceptCropActionLabel}"> 
    <f:ajax execute="@form" render="@none" /> 
</h:commandButton> 

然后你会做这样的事情

RequestContext.getCurrentInstance().update("id_of_whatever_you_want"); 

的支持bean和这种方式为我工作，所以我希望它为你工作。顺便说一句，你需要包括

import org.primefaces.context.RequestContext; 

在它的支持bean的工作。希望现在有所帮助。