No announcement yet.
  • Filter
  • Time
Clear All
new posts

    custom DynamicForm for uploading files without SmartClient server

    Based on this thread, I did the same in SmartGWT:

    Some notes (if anyone could comment on that).
    * The visibility mode HIDDEN does not add the Canvas to the DOM. I had to set the style on the iframe to hide it instead.

    * What's the difference between UploadItem and FileItem?
    -UploadItem does not seem to throw ChangedEvents (wanted to catch the event where the user has changed the file)
    -FileItem does not support setSelectionRange()

    * The FileUploader is a servlet on the webserver (google for implementations)

    //create a hidden frame
    Canvas iframe = new Canvas();
    iframe.setContents("<IFRAME NAME=\"fileUploadFrame\" style=\"width:0;height:0;border:0\"></IFRAME>");
    iframe.setVisibility(Visibility.VISIBLE); //Could not get the IFRAME in the page with Visibility HIDDEN
    //so set the style sizes to 0,0,0 instead to not show the IFRAME
    //create upload form with an upload item and a submit item
    final DynamicForm uploadForm = new DynamicForm();
    uploadForm.setTarget("fileUploadFrame"); //set target of FORM to the IFRAME
    uploadForm.setAction(GWT.getModuleBaseURL()+SERVLET_FILEUPLOAD); //call to a FileUpload servlet on the webserver
    //creates a HTML formitem with a textfield and a browse button
    final UploadItem uploadItem = new UploadItem("filename","Select a file");
    uploadItem.addChangedHandler(new ChangedHandler() {
    	public void onChanged(ChangedEvent event) {
    		//The item shows the whole (long) path, so set caret at end 
    		//so user can verify his chosen filename
    		String filename = (String)uploadItem.getValue();
    		if (filename != null) uploadItem.setSelectionRange(filename.length(), filename.length());
    		//Unfortunately UploadItem does not throw a ChangedEvent :(
    SubmitItem submitItem = new SubmitItem("upload", "Upload");
    uploadForm.setItems(uploadItem, submitItem);
    uploadForm.addSubmitValuesHandler(new SubmitValuesHandler() {
    	public void onSubmitValues(SubmitValuesEvent event) {
    		//maybe do some filename verification
    		//String filename = (String)uploadItem.getValue();
    return this;


    Hi, very usefull your post.


      thanks but where is path to save in folder of that image

      thanks but where is path to save in folder of that image


        Is this supposed to work with the latest?


          For everybody's benefit...

          Firefox 6.0, Chrome 17, IE9
          GWT 2.3.0
          SmartGWT 3.0p-2012-08-31

          To get this example to work, I needed to make sure that my servlet was overriding doPost () and not just doGet (). However, a secondary thing to consider is that this example, in its current form and with my environment as described above, opens a new browser tab when I click the upload button.

          I could get it to work in the background and without an additional tab opening up by doing this:
          1. Create the layout as above, but not create the iframe
          2. Instead, put the iframe in the application's main html file:
          <iframe name="fileUploadFrame" style="width:0;height:0;border:0"></iframe>
          3. On the servlet that accepts the file on the server, ovveride doPost () and not doGet ():
          protected void doPost (
          final HttpServletRequest request,
          final HttpServletResponse response)
          throws ServletException, IOException {
          4. Receive the file with apache-fileupload:
                  // create a factory for disk-based file items
                  final DiskFileItemFactory diskFileItemFactory = new DiskFileItemFactory ();
                  diskFileItemFactory.setSizeThreshold (5 * 1024 * 1024);
                  diskFileItemFactory.setRepository (new File ("c:/temp/apache-fileupload-temp-directory"));
                  // create a new file upload handler
                  // set overall request size constraint
                  final ServletFileUpload servletFileUpload = new ServletFileUpload (diskFileItemFactory);
                  // Parse the request
                  final List<FileItem> fileItemList = servletFileUpload.parseRequest (request);
                  for (final FileItem fileItem : fileItemList) {
                    // helpers
                    final String fileName = fileItem.getName ();
                    logger.debug ("  fileName: " + fileName);
                    // skip form fields
                    if (fileItem.isFormField ()) {
                      logger.debug ("  skipping fileItem because it is a form field");
                    // this is a File: write it to destination
                    // final long size = fileItem.getSize ();
                    final File file = new File ("c:/temp", fileName);
                    logger.debug ("  writing file to: " + file.getAbsolutePath ());
                    final InputStream inputStream = fileItem.getInputStream ();
                    FileUtil.writeFile (file, inputStream);