Vaadin Upload Component Will It Upload a Folder

  • Receiving Upload Data
  • CSS Style Rules

Live Demo

The Upload component allows a user to upload files to the server. Information technology displays a file name entry box, a file option button, and an upload submit push. The user can either write the filename in the text area or click the Scan button to select a file. After the file is selected, the user sends the file by clicking the upload submit button.

Uploading requires a receiver that implements Upload.Receiver to provide an output stream to which the upload is written past the server.

                                                      Upload                                          upload                                        =                                                            new                                                            Upload                    (                    "Upload information technology here"                    ,                                          receiver                    )                    ;                                                

Yous can set the text of the upload push button with setButtonCaption(). Note that it is difficult to alter the explanation or look of the Browse push button. This is a security characteristic of web browsers. The language of the Browse button is determined by the browser, so if you wish to take the language of the Upload component consistent, you lot will take to use the same language in your application.

                                                      upload                    .                    setButtonCaption                    (                    "Upload Now"                    )                    ;                                                

You can also hide the upload push button with .v-upload .five-button {display: none} in theme, take custom logic for starting the upload, and telephone call startUpload() to starting time it. If the upload component has setImmediate(truthful) enabled, uploading starts immediately after choosing the file.

Receiving Upload Data

The uploaded files are typically stored as files in a file organization, in a database, or as temporary objects in memory. The upload component writes the received data to an coffee.io.OutputStream then yous have plenty of freedom in how you lot can procedure the upload content.

To use the Upload component, y'all demand to implement the Upload.Receiver interface. The receiveUpload() method of the receiver is called when the user clicks the submit button. The method must return an OutputStream. To do this, information technology typically creates a file or a retentiveness buffer to which the stream is written. The method gets the file name and MIME blazon of the file, every bit reported by the browser.

While uploading, the upload progress can be monitored with an Upload.ProgressListener. The updateProgress() method gets the number of read bytes and the content length as parameters. The content length is reported by the browser, but the reported value is not reliable, and can as well be unknown, in which example the value is -one. It is therefore recommended to follow the upload progress and bank check the allowed size in a progress listener. Upload can be terminated by calling interruptUpload() on the upload component. Yous may want to use a ProgressBar to visualize the progress, and in indeterminate manner if the content length is not known.

When an upload is finished, successfully or unsuccessfully, the Upload component will emit the Upload.FinishedEvent result, which you lot tin can handle with an Upload.FinishedListener added to the upload component. The event object will include the file name, MIME type, and final length of the file. More than specific Upload.FailedEvent and Upload.SucceededEvent events will be called in the cases where the upload failed or succeeded, respectively.

The following example uploads images to /tmp/uploads directory in (UNIX) filesystem (the directory must exist or the upload fails). The component displays the uploaded image in an Image component.

                                                            // Show uploaded file in this placeholder                                                                                                                                terminal                                                                  Embedded                                              prototype                                            =                                                                  new                                                                  Embedded                      (                      "Uploaded Paradigm"                      )                      ;                                                                                                          image                      .                      setVisible                      (                      false                      )                      ;                                                                                                                                                                        // Implement both receiver that saves upload in a file and                                                                                                                                // listener for successful upload                                                                                                                                class                                                                  ImageUploader                                                                  implements                                                                  Receiver                      ,                                                                  SucceededListener                                                                  {                                                                                                                                                      public                                                                  File                                              file                      ;                                                                                                                                                                                              public                                                                  OutputStream                                                                  receiveUpload                      (                      String                                              filename                      ,                                                                                                                                                      String                                              mimeType                      )                                                                  {                                                                                                                                                      // Create upload stream                                                                                                                                                      FileOutputStream                                              fos                                            =                                                                  null                      ;                                                                  // Stream to write to                                                                                                                                                      try                                                                  {                                                                                                                                                      // Open the file for writing.                                                                                                                                  file                                            =                                                                  new                                                                  File                      (                      "/tmp/uploads/"                                                                  +                                              filename                      )                      ;                                                                                                                                  fos                                            =                                                                  new                                                                  FileOutputStream                      (                      file                      )                      ;                                                                                                                                                      }                                                                  catch                                                                  (                      final                                                                  java                      .                      io                      .                      FileNotFoundException                                              e                      )                                                                  {                                                                                                                                                      new                                                                  Notification                      (                      "Could not open file<br/>"                      ,                                                                                                                                  due east                      .                      getMessage                      (                      )                      ,                                                                                                                                                      Notification                      .                      Type                      .                      ERROR_MESSAGE                      )                                                                                                                                                      .                      show                      (                      Folio                      .                      getCurrent                      (                      )                      )                      ;                                                                                                                                                      return                                                                  null                      ;                                                                                                                                                      }                                                                                                                                                      return                                              fos                      ;                                                                  // Return the output stream to write to                                                                                                                                                      }                                                                                                                                                                                              public                                                                  void                                                                  uploadSucceeded                      (                      SucceededEvent                                              result                      )                                                                  {                                                                                                                                                      // Show the uploaded file in the image viewer                                                                                                                                  paradigm                      .                      setVisible                      (                      truthful                      )                      ;                                                                                                                                  epitome                      .                      setSource                      (                      new                                                                  FileResource                      (                      file                      )                      )                      ;                                                                                                                                                      }                                                                                                                                }                      ;                                                                                                                                ImageUploader                                              receiver                                            =                                                                  new                                                                  ImageUploader                      (                      )                      ;                                                                                                                                                                        // Create the upload with a caption and set receiver afterwards                                                                                                                                Upload                                              upload                                            =                                                                  new                                                                  Upload                      (                      "Upload Paradigm Here"                      ,                                              receiver                      )                      ;                                                                                                          upload                      .                      setButtonCaption                      (                      "First Upload"                      )                      ;                                                                                                          upload                      .                      addSucceededListener                      (                      receiver                      )                      ;                                                                                                                                                                        // Put the components in a panel                                                                                                                                Panel                                              panel                                            =                                                                  new                                                                  Panel                      (                      "Cool Epitome Storage"                      )                      ;                                                                                                                                Layout                                              panelContent                                            =                                                                  new                                                                  VerticalLayout                      (                      )                      ;                                                                                                          panelContent                      .                      addComponents                      (                      upload                      ,                                              image                      )                      ;                                                                                                          panel                      .                      setContent                      (                      panelContent                      )                      ;                                                      

Annotation that the example does non bank check the type of the uploaded files in whatever mode, which will cause an error if the content is anything else just an image. The programme also assumes that the MIME type of the file is resolved correctly based on the file name extension. Later on uploading an image, the component will look equally shown in Epitome Upload Example.

CSS Style Rules

                                                            .v-upload                                                                  {                                                                  }                                                                                                                                                      .gwt-FileUpload                                                                  {                                                                  }                                                                                                                                                      .v-button                                                                  {                                                                  }                                                                                                                                                      .v-push-wrap                                                                  {                                                                  }                                                                                                                                                      .v-push button-caption                                                                  {                                                                  }                                                      

The Upload component has an overall v-upload style. The upload push has the aforementioned structure and way as a regular Push component.

hookerbeirl1987.blogspot.com

Source: https://vaadin.com/docs/v7/framework/components/components-upload

0 Response to "Vaadin Upload Component Will It Upload a Folder"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel