Yükleme Düğmesi Alıcısı Vaadin

Question

Bir dosya yüklemeye çalışıyorum. İyi yükler, ancak yükleme yaparken tüm dosyaları gösterir. Yalnızca pdf,jpg ve jpeg dosyaları gibi seçili dosyaları kısıtlamak istiyorum.

Bir tarayıcı penceresi açıldığında bu dosyaları yalnızca bu dosyaların görünür durumda kalması gerektiğinde görünmesi gerekir. Böylece kullanıcı yanlış dosya seçemiyor.

Bunu nasıl yapabileceğimi söyleyen var mı?

Vaadin 7.5.1 ve Yükleme bileşenini ve bir Alıcısı kullanıyorum.

Answer 1

Geçerli Vaadin Upload component, bunu desteklemiyor. Vaadin Inc'in (veya katkıda bulunanların) tüm büyük tarayıcıların bu işlevselliği desteklediğini uygulayabilmesi için kolay bir enhancement request var.

İşte teknik açıklama verilmiştir: Vaadin Yükle bileşeni böyle HTML oluşturur:

<input type="file" name="foo"> 

ama ne üretmek için isterdi böyle bir şey olurdu:

İşte

<input type="file" name="foo" accept=".pdf,.jpg,.jpeg"> 

nasıl yukarıdaki HTML'de Firefox'ta görünecektir:

Temel olarak accept özniteliği, tarayıcının belirli bir filtreye sahip bir dosya seçim iletişim kutusu açmasını söyleyecektir.

Bunun bir istemci tarafı olayı olduğunu unutmayın. Bilgili son kullanıcının filtrenizle eşleşmeyen bir şeyi sunucunuza yüklemesini engellemez. Bu, nasıl yapılırsa yapılsın, müşteri tarafında yapılan her türlü filtreleme için geçerli. Bu nedenle yine de bazı sunucu tarafı doğrulamasına ihtiyacınız olacak.

Answer 2

JavaScript ile çocuk oyuncağı - sadece bu html öğesinin actuall sınıf adını bulmak için bu düğme/gözat alanının yerleştirildiği sayfanın HTML kaynağını kontrol etmelisiniz - bu .csv örneğidir, Vaadin sınıf adı oluşturur "gwt-FileUpload" başlıklı, bu yüzden bu "Import" düğmesine tıkladıktan sonra sadece .csv dosyaları görmek için gibi ayarlamak zorunda:

upload.setButtonCaption("Import"); 
JavaScript.getCurrent().execute("document.getElementsByClassName('gwt-FileUpload')[0].setAttribute('accept', '.csv')"); 

Answer 3

pom dosyasına bu bağımlılığı ekle

<dependency> 
    <groupId>com.wcs.wcslib</groupId> 
    <artifactId>wcslib-vaadin-widget-multifileupload</artifactId> 
    <version>1.10</version> 
</dependency> 

Ve dosyaları yüklemek için aşağıdaki kodu kullanın, g setAcceptFilter yöntem:

UploadStateWindow uploadStateWindow = new UploadStateWindow(); 
     uploadStateWindow.setOverallProgressVisible(true); 
MultiFileUpload fileUpload = new MultiFileUpload(uploadFinishedHandler, 
       uploadStateWindow, true); 
fileUpload.setAcceptFilter(".png,.jpg"); 
fileUpload.setImmediate(true); 

fileUpload.getSmartUpload().setUploadButtonCaptions("upload", "upload");