Rails jQuery File Upload for IE8

I basically followed RailsCasts #381 (jQuery File Upload) and #383 (Uploading to Amazon S3) to create a jQuery file upload solution for my app. It works great in Chrome, Firefox, Safari, and IE10. However, when I try it in IE8 the progress bar shows up empty/hollow and then nothing happens. Any help would be GREATLY appreciated.

My Form:

<%= s3_uploader_form post: 
wizard_path,
   as: "profile[image]" do %>
     <%= file_field_tag :file, multiple: false %>
<% end %>            

<script id="template-upload" type="text/x-tmpl">
  <div class="upload">
   {%=o.name%}
   <div class="progress">
    <div class="progress-bar progress-bar-success" style="width: 0%"></div>
   </div>
  </div>
</script>

My application.js file:

//= require jquery
//= require jquery_ujs
//= require jquery-fileupload/vendor/jquery.ui.widget
//= require jquery-fileupload/vendor/tmpl
//= require jquery-fileupload/vendor/load-image.all.min
//= require jquery-fileupload/vendor/canvas-to-blob
//= require jquery-fileupload/jquery.iframe-transport
//= require jquery-fileupload/jquery.fileupload
//= require jquery-fileupload/jquery.fileupload-process
//= require jquery-fileupload/jquery.fileupload-image
//= require jquery.validate.min
//= require jquery.dotdotdot.min
//= require jquery_nested_form
//= require placeholder
//= require bootstrap
//= require_tree .

My profile.js file:

jQuery(function() {
  return $('#fileupload').fileupload({
    dataType: 'json',
    // Enable image resizing, except for Android and Opera,
    // which actually support image resizing, but fail to
    // send Blob objects via XHR requests:
    disableImageResize: /Android(?!.*Chrome)|Opera/
        .test(window.navigator && navigator.userAgent),
    imageMinWidth: 153,
    imageMinHeight: 212,
    imageMaxWidth: 153,
    imageMaxHeight: 212,
    imageCrop: true,
    process: [
      {
        action: 'load',
        fileTypes: /^image\/(gif|jpeg|png)$/,
        maxFileSize: 4000000
      }, {
        action: 'resize',
      }, {
        action: 'save'
      }
    ],

    add: function(e, data) {
      var file, types, current_data;
      types = /(\.|\/)(gif|jpe?g|png)$/i;
      file = data.files[0];
      if (types.test(file.type) || types.test(file.name)) {
        current_data = $(this);

        // These 2 lines are from RC #381 (and are necessary for my progress bar to work)       
        data.context = $(tmpl("template-upload", file));    
        $('#fileupload').append(data.context);

        return data.process(function () {
          return current_data.fileupload('process', data);
        }).done(function() {
          return data.submit();
        });

      } else {
        return alert("" + file.name + " is not a gif, jpeg, or png image file");
      }
    },

      progress: function(e, data) {
        var progress;
        if (data.context) {
          progress = parseInt(data.loaded / data.total * 100, 10);
          return data.context.find('.progress-bar').css('width', progress + '%');
        }
      },

      done: function(e, data) {
        var content, domain, file, path, to;
        file = data.files[0];
        domain = $('#fileupload').attr('action');
        path = $('#fileupload input[name=key]').val().replace('${filename}', file.name);
        to = $('#fileupload').data('post');
        content = {};
        content[$('#fileupload').data('as')] = domain + path;
        jQuery.ajax({
          type: "PUT",
          url: to,
          data: content,
          dataType: "script",
        });
        if (data.context) {
          return data.context.remove();
        }
      },

      fail: function(e, data) {
        alert("" + data.files[0].name + " failed to upload.");
        console.log("Upload failed:");
        return console.log(data);
      }
    });

});