title: How to post ajax call with multipart/form-data?
body: <p>I need to upload a file from extjs page, via AJAX call, to the server. I am able to do it with simple HTML page to servlet but using extjs (v4.0.7) i am not getting file in my servlet when i pars request. Servlet recognizes multipart page but nothing comes with the call. Can anyone tell me what I am doing wrong in my code?</p>
  
  <p>EXTJS code:</p>
  
  <pre><code>var fileName = Ext.getCmp("fileName").getValue();
  
  Ext.Ajax.request({
      url : 'UploadServlet',
      method: 'POST',  
      headers: {'Content-Type': 'multipart/form-data'},
      params :{
         'fileName': fileName.trim()
      },
  
      success: function ( result, request ) {
          resultData = result.responseText;
      },
      failure: function ( result, request ) {
          resultData = result.responseText;
      }   
  });
  </code></pre>
  
  <p>Servlet code:</p>
  
  <pre><code>protected void doPost(HttpServletRequest request,HttpServletResponse response)
          throws ServletException, IOException {  
  
      .......
  
       // Check that we have a file upload request
        isMultipart = ServletFileUpload.isMultipartContent(request);
        response.setContentType("text/html");
        java.io.PrintWriter out = response.getWriter( );
        if( !isMultipart ){
            // display no file attached error
           return;
        }
  
        // Create a factory for disk-based file items
        DiskFileItemFactory factory = new DiskFileItemFactory();
        // maximum size that will be stored in memory
        factory.setSizeThreshold(maxMemSize);
        // Location to save data that is larger than maxMemSize.
        factory.setRepository(new File(tempDir));
  
        // Create a new file upload handler
        ServletFileUpload upload = new ServletFileUpload(factory);
        // maximum file size to be uploaded.
        upload.setSizeMax( maxFileSize );
  
  
        try{ 
            // Parse the request to get file items.
  
        ////// fileItems is empty, 
                ////nothing is comming from extjs page/////////
            List&lt;FileItem&gt; fileItems = upload.parseRequest(request);
  
            // Process the uploaded file items
            Iterator&lt;FileItem&gt; i = fileItems.iterator();
  
            while ( i.hasNext () ) {                
               FileItem fi = (FileItem)i.next();
  
               if ( !fi.isFormField () ) {
                  // Get the uploaded file parameters
                  String fieldName = fi.getFieldName();
                  String fileName = fi.getName();
                  String contentType = fi.getContentType();
                  boolean isInMemory = fi.isInMemory();
                  long sizeInBytes = fi.getSize();
  
                  // check if file exists
                  File propFile = new File(tempDir, fileName.substring( fileName.lastIndexOf("\\")));
                  if (!propFile.exists()) {  
                      // Write the file
                      if( fileName.lastIndexOf("\\") &gt;= 0 ){
                         file = new File(tempDir + 
                         fileName.substring( fileName.lastIndexOf("\\"))) ;
                      }else{
                         file = new File(  tempDir + 
                         fileName.substring(fileName.lastIndexOf("\\")+1)) ;
                      }   
                      //InputStream uploadedStream = fi.getInputStream();
                      fi.write( file ) ;
                      out.println("Uploaded Filename: " + fileName + "  is in " + filePath + "&lt;br&gt;");
                  } 
  
                  ..... 
               }
            }
  </code></pre>