Announcement

Collapse
No announcement yet.
X
Collapse
  • Page of 1
  • Filter
  • Time
Clear All
new posts
Previous template Next
    #1

    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)

    Code:
    //create a hidden frame
Canvas iframe = new Canvas();
iframe.setID("fileUploadFrame");
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.setNumCols(4);
uploadForm.setTarget("fileUploadFrame"); //set target of FORM to the IFRAME
uploadForm.setEncoding(Encoding.MULTIPART);
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.setWidth(300);
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");
submitItem.setStartRow(false);
submitItem.setEndRow(false);

uploadForm.setItems(uploadItem, submitItem);

uploadForm.addSubmitValuesHandler(new SubmitValuesHandler() {
	
	public void onSubmitValues(SubmitValuesEvent event) {
		//maybe do some filename verification
		//String filename = (String)uploadItem.getValue();
		uploadForm.submitForm();
	}
});

this.addMember(uploadForm);
this.addMember(iframe);

return this;
    Tags: None
    #2
    thanks

    Hi, very usefull your post.
    thanks.

    Comment

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

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

      Comment

        #4
        Is this supposed to work with the latest?

        Comment

          #5
          For everybody's benefit...

          Using
          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:
          [/code]
          <body>
          <iframe name="fileUploadFrame" style="width:0;height:0;border:0"></iframe>
          ...
          [code]
          3. On the servlet that accepts the file on the server, ovveride doPost () and not doGet ():
          [code]
          protected void doPost (
          final HttpServletRequest request,
          final HttpServletResponse response)
          throws ServletException, IOException {
          [code]
          4. Receive the file with apache-fileupload:
          Code:
                  // 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");
            continue;
          }
          
          // 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);
        }

          Comment

          Previous template Next
          Working...
          X