Primefaces上传，如何只允许一个预先上传模式 [英] Primefaces upload, how to only allow one upload in advance mode

问题描述

 
 
 
 
 code>< p：fileUpload fileUploadListener =＃{fileUploadController.handleFileUpload}
 mode =advanced
 multiple =false
 update =messages
 sizeLimit =100000000
 allowTypes =/（\。| \ /）（gif | jpe？g | png | doc | docx | txt | pdf）$ /
 auto =假/> 
 
 
   

你可以看到我有muliple =false，但是用户仍然可以上传多个文件，任何提示？

编辑：

 < p：fileUpload widgetVar =uploadfileUploadListener =＃{fileUploadController.handleFileUpload}
 mode =advanced
 multiple =false
 update =messages
 label =Select文件
 sizeLimit =100000000
 allowTypes =/（\。| \ /）（gif | jpe？g | png | doc | docx | txt | pdf | html）$ / 
 auto =false/> 
 
 
   

增加了

in my js

 < script type =text / javascript> 
函数Naviagtion（）
 {
 // alert（发送到打印暂存队列，你现在可以关闭这个程序，你的工作仍然会打印出来）。 
 window.setTimeout（afterDelay，500）; 
 location.href ='FilesUploaded.xhtml'; 
 
 
 $ b upload.buttonBar.find（'input [type = file]'）。change（function（）{
 if（this.value）{ 
 var files = upload.uploadContent.find（'。files tr'）; 
 
 if（files.length> 1）{
 files.get（0）.remove （）; 
} 
} 
}）; 
< / script> 
  

但是我仍然可以进行多重上传，我是否正确地进行了这方面的工作

解决方案

multiple =false只告诉浏览器禁用多个文件选择在浏览器特定的浏览对话框中。但是，它确实不会阻止最终用户多次点击PrimeFaces文件上传部分的选择按钮来多次浏览和添加单个文件。

最好的办法是引入一些JS / jQuery来删除所有以前选择的文件，当选择一个新文件时。假设你给了< p：fileUpload> a widgetVar =upload

$ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ （）。
if（this.value）{
var files = upload.uploadContent.find（'。files tr'）;

if（files.length> 1）{
files.get（0）.remove（）;
}
}
}）;
}）;

适用于PrimeFaces 3.5。

I am wondering if it possible, by using the primefaces upload in advance mode to limit the user uploading one file only, currently i have :

 <p:fileUpload fileUploadListener="#{fileUploadController.handleFileUpload}"
                                  mode="advanced" 
                                  multiple="false" 
                                  update="messages"
                                  sizeLimit="100000000" 
                                  allowTypes="/(\.|\/)(gif|jpe?g|png|doc|docx|txt|pdf)$/"
                                  auto="false"/>


                    <p:growl id="messages" showDetail="true"/>

as you can see i have muliple ="false" but a user is still able to upload multiple files, any tips ?

EDIT :

                <p:fileUpload widgetVar="upload" fileUploadListener="#{fileUploadController.handleFileUpload}"
                              mode="advanced" 
                              multiple="false" 
                              update="messages"
                              label="Select File"
                              sizeLimit="100000000" 
                              allowTypes="/(\.|\/)(gif|jpe?g|png|doc|docx|txt|pdf|html)$/"
                              auto="false"/>


                <p:growl id="messages" showDetail="true"/>

have added the widgetVar above

and in my js

<script type="text/javascript"> 
        function Naviagtion()
        {
            //alert("Sent to the printing holding queue, you may close this app now, your work will still print out ");
            window.setTimeout(afterDelay, 500);
            location.href = 'FilesUploaded.xhtml';

        }

        upload.buttonBar.find('input[type=file]').change(function() {
            if (this.value) {
                var files = upload.uploadContent.find('.files tr');

                if (files.length > 1) {
                    files.get(0).remove();
                }
            }
        });
    </script>

but i am still able to multi upload, am i going about this in the right direction

解决方案

The multiple="false" only tells the webbrowser to disable multiple file selection in the browser-specific Browse dialog. However, it indeed doesn't prevent the enduser from clicking multiple times on the Choose button of the PrimeFaces file upload section to browse and add a single file multiple times.

Your best bet is to bring in some JS/jQuery to remove all previously selected files when a new file is selected. Provided that you have given your <p:fileUpload> a widgetVar="upload", then this should do:

$(document).ready(function() {
    upload.buttonBar.find('input[type=file]').change(function() {
        if (this.value) {
            var files = upload.uploadContent.find('.files tr');

            if (files.length > 1) {
                files.get(0).remove();
            }
        }
    });
});

Works for me on PrimeFaces 3.5.

这篇关于Primefaces上传，如何只允许一个预先上传模式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！