Fix #68: Fix refresh method to trigger change correctly

CHANGE.md

@@ -12,6 +12,7 @@ version 3.0.0
     - Fix clearing of file input rightly for IE 9 & IE 10
     - Degrade plugin automatically to a native file input for older IE versions
     - Prevent change method firing twice when file is cleared after error is encountered in IE 11.
+6. (bug #68): Fix refresh method of the fileinput to trigger change correctly.
 
 version 2.9.0
 =============

examples/index.html

@@ -34,6 +34,7 @@
                 </div>
                 <div class="form-group">
                     <button class="btn btn-warning" type="button">Disable Test</button>
+                    <button class="btn btn-info" type="reset">Refresh Test</button>
                     <button class="btn btn-primary">Submit</button>
                     <button class="btn btn-default" type="reset">Reset</button>
                 </div>
@@ -55,9 +56,11 @@
             return filename.replace('(', '_').replace(']', '_');
         }
 	});
+    /*
     $(".file").on('fileselect', function(event, n, l) {
         alert('File Selected. Name: ' + l + ', Num: ' + n);
     });
+    */
 	$("#file-3").fileinput({
 		showUpload: false,
 		showCaption: false,
@@ -70,13 +73,18 @@
         } else {
             $('#file-4').fileinput('disable');
         }
+    });    
+    $(".btn-info").on('click', function() {
+        $('#file-4').fileinput('refresh', {previewClass:'bg-info'});
     });
+    /*
     $('#file-4').on('fileselectnone', function() {
         alert('Huh! You selected no files.');
     });
     $('#file-4').on('filebrowse', function() {
         alert('File browse clicked for #file-4');
     });
+    */
     $(document).ready(function() {
         $("#test-upload").fileinput({
             'showPreview' : false,

js/fileinput.js

@@ -282,8 +282,8 @@
                 preview: self.$preview.html(),
                 caption: self.$caption.html()
             };
-            self.options = options;
             self.autoSizeCaption();
+            self.options = options;
             self.$element.removeClass('file-loading');
         },
         getLayoutTemplate: function(t) {
@@ -297,7 +297,6 @@
         listen: function () {
             var self = this, $el = self.$element, $cap = self.$captionContainer, $btnFile = self.$btnFile;
             $el.on('change', $.proxy(self.change, self));
-            
             $(window).on('resize', function() {
                 setTimeout(function() {
                     self.autoSizeCaption();
@@ -311,9 +310,10 @@
             self.$container.on('click', '.fileinput-remove:not([disabled])', $.proxy(self.clear, self));
         },
         refresh: function (options) {
-            var self = this, params = (arguments.length) ? $.extend(self.options, options) : self.options;
-            self.$element.off();
+            var self = this, $el = self.$element, params = (arguments.length) ? $.extend(self.options, options) : self.options;
+            $el.off();
             self.init(params);
+            $el.on('change', $.proxy(self.change, self));
         },
         initPreview: function () {
             var self = this, html = '', content = self.initialPreview, len = self.initialPreviewCount,