4

我尝试上传一些文件，然后重定向到另一个页面，oncomplete 问题是oncomplete只有在第一个文件上传后才有效

<p:fileUpload  mode="advanced"
     label="#{FileMessages.file_add_file_lbl_Select_File}"
     fileUploadListener="#{fileAddFileAction.upload}"
     oncomplete="redirect(#{fileAddFileAction.groupId});"
     multiple="true"
     allowTypes="/(\.|\/)(txt|doc|docx|pdf)$/"
     widgetVar="fileUplaod" >
 </p:fileUpload>

Java 脚本函数：redirect(groupId)

function redirect(groupId) {
     var url = "/network/group/files.html?gId="+groupId;
     $(location).attr('href',url);
}

bean.java

public void upload(FileUploadEvent event) {

    UploadedFile uploadedFile = event.getFile();

    try {
        String thumbnail = getDestination() + uploadedFile.getFileName();
        String[] filetype = thumbnail.split("\\.");
        String newfilename = Calendar.getInstance().getTimeInMillis() + "." + filetype[1];

        SystemFile file = new SystemFile();
        file.setAccount(getActor().getAccount());
        file.setCtime(new Date());
        file.setName(newfilename);
        file.setPath(getDestination());
        file.setFileType(FileUtil.checkFileType(filetype[1]));
        file.setOriginalName(uploadedFile.getFileName());

        getFileService().saveSystemFile(file);

        copyFile(getDestination() + newfilename, uploadedFile.getInputstream());

        copyFile(getDestination() + newfilename, uploadedFile.getInputstream());

    } catch (IOException ex) {
        Logger.getLogger(FileAddFileAction.class.getName()).log(Level.SEVERE, null, ex);
    }
}
4

2 回答 2

0

这似乎是一个已知问题：http ://code.google.com/p/primefaces/issues/detail?id=3836

用户已在此页面上完成了自定义补丁：

可以通过在 ap:fileUpload 标记中添加以下行来使用它：

<p:ajax event="fileUploadsComplete" listener="#{filesBean.done}"/>

filesBean.done 方法如下所示：

public void done(FileUploadsCompleteEvent event) {
    System.out.println("done"); 
}
于 2013-04-09T21:20:10.740 回答
0

我有一个类似的问题（Primefaces 5）。由于“父级不是 ClientBehaviorHolder 的实例”错误，添加 ajax fileUploadsComplete 失败。

这是我的hack-around。这不是最令人满意的，但它正在工作：

<script>
    function setUploadFilesCount() {
        var numberOfFiles = $('.ui-fileupload-preview').size();
        var input = document.getElementById('fileupload-multi-fix-input');
        input.value = numberOfFiles;
        input.onchange();
    }
</script>

<h:form id="file-upload-form">
    <p:fileUpload id="file-upload" fileUploadListener="#{backingBean.handleFilesUpload}" mode="advanced" dragDropSupport="false"
                               sizeLimit="10000000" multiple="true" allowTypes="/(\.|\/)(jpg)$/" onstart="setUploadFilesCount()" update=":content">
    </p:fileUpload>
</h:form>

<h:form prependId="false" style="display:none;">
    <h:inputText id="fileupload-multi-fix-input" value="#{backingBean.numberOfUploadFiles}">
        <f:ajax event="change" execute="@form"  />
    </h:inputText>
</h:form>

所以在我的 BackingBean 中，我有以下内容：

@Named
@SessionScoped
public class BackingBean implements Serializable{

    private static final long serialVersionUID = 1L;

    private int numberOfUploadFiles; //... add getter and setter

    private boolean isUploadComplete = false; //... add getter and setter

    private int uploadCount = 0;

    public void handleFilesUpload(FileUploadEvent event) throws IOException {

        // ... handle file upload here

        uploadCount++;

        if(uploadCount == numberOfUploadFiles){
            isUploadComplete = true;
        }
    }
}

解释：

我添加了一个 JavaScript 函数 setUploadFilesCount和一个<h:form />包含隐藏的<h:input />.

<p:fileUpload onstart=...在（第一个）文件传输开始时调用一次。我调用 JavaScript 函数setUploadFilesCount来onstart设置支持 bean 中上传文件的数量。

通过读取具有 css 类的元素的出现次数来检测文件的数量ui-fileupload-preview。视图中的ui-fileupload-preview元素数量等于上传文件的数量。这发生在

$('.ui-fileupload-preview').size();

input.onchange();使隐藏的输入字段值提交给支持 bean。

在支持 bean 上，我可以通过增加一个计数器来检查最后一个项目是否已上传

uploadCount++;

if(uploadCount == numberOfUploadFiles){...}

所以我可以检查是否所有项目都已上传或在最后一个上传项目完成后调用特殊函数。

<p:fileUpload oncomplete...每次上传上传文件之一时调用。

因此，在您的特定情况下，您必须另外将您的 javascript 包装成这样：

<h:panelGroup id="afterLoad">
    <h:outputScript>
        function redirect(groupId) {
            if(#{backingBean.isUploadComplete}=='true'){
                var url = "/network/group/files.html?gId="+groupId;
                $(location).attr('href',url);
            }
        }
    </h:outputScript>
</h:panelGroup>

将其放在与 the 相同的形式中<p:fileUpload并添加<p:fileUpload ... update="afterLoad" ...

于 2014-08-12T17:25:46.763 回答