title: Grails JQuery UI Progress Bar
body: <p>I am trying to use the jQuery UI Progress bar in a Grails application for a file upload. I am using the g:uploadForm to submit the file and I am not sure how to go about getting a hold of the XMLHttpRequest object in order to get a hold of the progress on the transferring byte stream so I can feed the parameters to the jQuery UI progressbar to update itself. Here is what I am trying so far but no luck. I would immensely appreciate any guidance.</p>
  
  <pre><code>$("#progressbar").progressbar({
              value: false,
              change: function() {
                  $(".progress-label").text( $("#uploadErrors").progressbar( "value" ) + "%" );
              },
              complete: function() {
                  $(".progress-label").text( "Complete!" );
              }
          });
          $(".uploaderForm").submit();
          //var fileSize = $("#chseFile")[0].files[0].size;
  
          var request = new XMLHttpRequest();
  
          request.upload.addEventListener('progress', function(event) {
              var percent = event.loaded / event.total;
              console.log(percent);
              $("#progressbar").progressbar( "value", percent * 100 );
          });
  </code></pre>
  
  <p>The controller's upload method is quite simple because it simply passes the work onto a Service:</p>
  
  <pre><code>def upload() {
  
      params.selectedBatch = selectedBatch
  
      // Diag
      println "*** Request info: " + request
      println "*** Session info: " + request.getSession()
      println "*** Servlet context: " + request.getSession().getServletContext()
  
      def f = request.getFile('file')
  
      if (f.empty) {
          println "File cannot be empty!"
      }
  
      else {
              // The case that we have an Excel file upload. This if statement might need to be
              // a switch statement in the future when we start accepting other upload formats like
              // CSV and/or XML.
              if (params.fileTypegrp.toInteger() == 1) {
  
                  // We know its an Excel file, now we use a switch for the data type.    
                  switch (params.dataTypegrp.toInteger()) {
                      case 1:
                          fileImportService.excelAccountFileUpload(params)
                          println "upload complete!"
                          break
  .
  .
  .
  </code></pre>