Fix #192: Ability to extend and add one's own ajax settings for delete and upload

CHANGE.md

@@ -16,6 +16,9 @@ version 4.1.8
 12. (enh #187): New property `previewFileIcon` to configure file icon shown in preview for unreadable file types.
 13. (enh #188): Clear fileinput more correctly for all browsers when initialPreview is set enhancement
 14. (enh #189): Reinitialize initial preview delete events correctly on file selection.
+15. (enh #192): Ability to extend and add one's own ajax settings.
+    - New property `ajaxDeleteSettings` to help extend and add to delete ajax settings. 
+    - `ajaxSettings` to help extend and add upload ajax settings
 
 version 4.1.7
 =============

README.md

@@ -954,6 +954,10 @@ _string_ the encoding to be used while reading a text file. Applicable only for
 #### ajaxSettings
 _object_ additional ajax settings to pass to the plugin before submitting the ajax request. Applicable only for ajax uploads. This can be useful to pass additional tokens to headers or one can use it for setting other ajax options for advanced cases. Refer the [jQuery ajax documentation](http://api.jquery.com/jQuery.ajax/) for the various settings you can configure.
 
+#### ajaxDeleteSettings
+_object_ additional ajax settings to pass to the plugin before submitting the delete ajax request in each initial preview thumbnail. Applicable only for ajax deletions. This can be useful to pass additional tokens to headers or one can use it for setting other ajax options for advanced cases. Refer the [jQuery ajax documentation](http://api.jquery.com/jQuery.ajax/) for the various settings you can configure.
+
+
 ### Plugin Events
 The plugin supports these events:
 

js/fileinput.js

@@ -28,7 +28,7 @@
             div.parentNode.removeChild(div);
             return status;
         },
-        getNum = function(num, def) {
+        getNum = function (num, def) {
             def = def || 0;
             if (typeof num === "number") {
                 return num;
@@ -638,7 +638,8 @@
                 url = isSet('url', config) ? config.url : false,
                 key = isSet('key', config) ? config.key : null,
                 disabled = (url === false),
-                actions = self.initialPreviewShowDelete ? self.renderFileActions(false, true, disabled, url, key, i) : '',
+                actions = self.initialPreviewShowDelete ? self.renderFileActions(false, true, disabled, url, key,
+                    i) : '',
                 footer = template.repl('{actions}', actions);
             return footer.repl('{caption}', caption).repl('{width}', width)
                 .repl('{indicator}', '').repl('{indicatorTitle}', '');
@@ -742,69 +743,70 @@
                     }
                 };
             self.$preview.find('.kv-file-remove').each(function () {
-                var $el = $(this), $frame = $el.closest('.file-preview-frame'), index = $el.data('index'), 
+                var $el = $(this), $frame = $el.closest('.file-preview-frame'), index = $el.data('index'),
                     config = isEmpty(self.initialPreviewConfig[index]) ? null : self.initialPreviewConfig[index],
                     extraData = isEmpty(config) || isEmpty(config.extra) ? deleteExtraData : config.extra,
-                    vUrl = $el.data('url') || self.deleteUrl, vKey = $el.data('key'), $content;
-                if (typeof extraData === "function") { 
+                    vUrl = $el.data('url') || self.deleteUrl, vKey = $el.data('key'), $content, settings;
+                if (typeof extraData === "function") {
                     extraData = extraData();
                 }
                 if (vUrl === undefined || vKey === undefined) {
                     return;
                 }
-                $el.off('click').on('click', function () {
-                    $.ajax({
-                        url: vUrl,
-                        type: 'POST',
-                        dataType: 'json',
-                        data: $.extend({key: vKey}, extraData),
-                        beforeSend: function (jqXHR) {
-                            addCss($frame, 'file-uploading');
-                            addCss($el, 'disabled');
-                            self.raise('filepredelete', [vKey, jqXHR, extraData]);
-                        },
-                        success: function (data, textStatus, jqXHR) {
-                            if (data.error === undefined) {
-                                self.raise('filedeleted', [vKey, jqXHR, extraData]);
-                            } else {
-                                self.showError(data.error, extraData, $el.attr('id'), vKey, 'filedeleteerror', jqXHR);
-                                $frame.removeClass('file-uploading');
-                                $el.removeClass('disabled');
-                                resetProgress();
-                                return;
-                            }
-                            $frame.removeClass('file-uploading').addClass('file-deleted');
-                            $frame.fadeOut('slow', function () {
-                                self.clearObjects($frame);
-                                $frame.remove();
-                                $content = $(document.createElement('div')).html(self.original.preview);
-                                $content.find('.file-preview-frame').each(function () {
-                                    $that = $(this);
-                                    if ($that.find('.kv-file-remove').attr('data-key') == vKey) {
-                                        $that.remove();
-                                    }
-                                });
-                                self.initialPreviewContent = $content.html();
-                                if (self.initialPreviewCount > 0) {
-                                    self.initialPreviewCount -= 1;
-                                }
-                                caption = self.initialCaption;
-                                if (self.initialCaption.length === 0) {
-                                    caption = self.msgSelected.repl('{n}', self.initialPreviewCount);
-                                }
-                                self.original.preview = $content.html();
-                                self.setCaption(caption);
-                                self.original.caption = self.$caption.html();
-                                $content.remove();
-                                resetProgress();
-                            });
-                        },
-                        error: function (jqXHR, textStatus, errorThrown) {
-                            self.showError(errorThrown, extraData, $el.attr('id'), vKey, 'filedeleteerror', jqXHR);
+                settings = $.extend({
+                    url: vUrl,
+                    type: 'POST',
+                    dataType: 'json',
+                    data: $.extend({key: vKey}, extraData),
+                    beforeSend: function (jqXHR) {
+                        addCss($frame, 'file-uploading');
+                        addCss($el, 'disabled');
+                        self.raise('filepredelete', [vKey, jqXHR, extraData]);
+                    },
+                    success: function (data, textStatus, jqXHR) {
+                        if (data.error === undefined) {
+                            self.raise('filedeleted', [vKey, jqXHR, extraData]);
+                        } else {
+                            self.showError(data.error, extraData, $el.attr('id'), vKey, 'filedeleteerror', jqXHR);
                             $frame.removeClass('file-uploading');
+                            $el.removeClass('disabled');
                             resetProgress();
+                            return;
                         }
-                    });
+                        $frame.removeClass('file-uploading').addClass('file-deleted');
+                        $frame.fadeOut('slow', function () {
+                            self.clearObjects($frame);
+                            $frame.remove();
+                            $content = $(document.createElement('div')).html(self.original.preview);
+                            $content.find('.file-preview-frame').each(function () {
+                                $that = $(this);
+                                if ($that.find('.kv-file-remove').attr('data-key') == vKey) {
+                                    $that.remove();
+                                }
+                            });
+                            self.initialPreviewContent = $content.html();
+                            if (self.initialPreviewCount > 0) {
+                                self.initialPreviewCount -= 1;
+                            }
+                            caption = self.initialCaption;
+                            if (self.initialCaption.length === 0) {
+                                caption = self.msgSelected.repl('{n}', self.initialPreviewCount);
+                            }
+                            self.original.preview = $content.html();
+                            self.setCaption(caption);
+                            self.original.caption = self.$caption.html();
+                            $content.remove();
+                            resetProgress();
+                        });
+                    },
+                    error: function (jqXHR, textStatus, errorThrown) {
+                        self.showError(errorThrown, extraData, $el.attr('id'), vKey, 'filedeleteerror', jqXHR);
+                        $frame.removeClass('file-uploading');
+                        resetProgress();
+                    }
+                }, self.ajaxDeleteSettings);
+                $el.off('click').on('click', function () {
+                    $.ajax(settings);
                 });
             });
         },
@@ -988,7 +990,7 @@
         ajaxSubmit: function (fnBefore, fnSuccess, fnComplete, fnError) {
             var self = this, settings;
             self.uploadExtra();
-            settings = $.extend(self.ajaxSettings, {
+            settings = $.extend({
                 xhr: function () {
                     var xhrobj = $.ajaxSettings.xhr();
                     return self.initXhr(xhrobj, 98);
@@ -1004,7 +1006,7 @@
                 success: fnSuccess,
                 complete: fnComplete,
                 error: fnError
-            });
+            }, self.ajaxSettings);
             self.ajaxRequests.push($.ajax(settings));
         },
         uploadSingle: function (i, files, allFiles) {
@@ -1426,7 +1428,7 @@
                     $status.html('');
                     return;
                 }
-                var node = ctr + i, previewId = previewInitId + "-" + node, isText, file = files[i], 
+                var node = ctr + i, previewId = previewInitId + "-" + node, isText, file = files[i],
                     caption = self.slug(file.name), fileSize = (file.size || 0) / 1000, checkFile, fileExtExpr = '',
                     previewData = objUrl.createObjectURL(file), fileCount = 0, j, msg, typ, chk,
                     fileTypes = self.allowedFileTypes, strTypes = isEmpty(fileTypes) ? '' : fileTypes.join(', '),
@@ -1543,7 +1545,7 @@
             self.$container.removeClass('file-input-new file-input-ajax-new');
             if (arguments.length === 1) {
                 self.raise('fileselect', [numFiles, label]);
-            }            
+            }
             if (self.initialPreviewContent.length > 0) {
                 self.initPreviewDeletes();
             }
@@ -1566,8 +1568,10 @@
                 };
             self.resetUpload();
             self.hideFileIcon();
-            if (isDragDrop) {
+            if (self.isUploadable) {
                 self.$container.find('.file-drop-zone .' + self.dropZoneTitleClass).remove();
+            }
+            if (isDragDrop) {
                 tfiles = files;
             } else {
                 if (e.target.files === undefined) {
@@ -1595,7 +1599,7 @@
                 } else {
                     $preview.html('');
                 }
-                
+
                 if (isSingleUpload && ctr > 0) {
                     self.filestack = [];
                 }
@@ -1837,7 +1841,8 @@
         fileActionSettings: {},
         otherActionButtons: '',
         textEncoding: 'UTF-8',
-        ajaxSettings: {}
+        ajaxSettings: {},
+        ajaxDeleteSettings: {}
     };
 
     $.fn.fileinput.Constructor = FileInput;