|Thankful to Krajee!||to get more out of us.|
NOTE: The plugins on this site, strive to use a lot of CSS3 and HTML5 features in addition to JQuery. Hence, one may find either CSS3, HTML5 or a mix of both to achieve a plugin's requirements in many implementations.
An enhanced HTML 5 file input for Bootstrap 3.x with file preview for various files, offers multiple selection, and more. The plugin allows you a simple way to setup an advanced file picker/upload control built to work specially with Bootstrap CSS3 styles. It enhances the file input functionality further, by offering support to preview a wide variety of files i.e. images, text, html, video, audio, flash, and objects. In addition, it includes AJAX based uploads, dragging & dropping files, viewing upload progress, and selectively previewing, adding, or deleting files.
This plugin was initially inspired by this blog article and Jasny's File Input plugin. But the plugin has now matured with various additional features and enhancements to be a complete (yet simple) file management tool and solution for web developers.
With release v4.0.0, the plugin now supports AJAX based uploads using HTML 5 FormData and XHR2 protocol, which is supported in most modern browsers. It also has inbuilt support for AJAX based file deletion from the server. This thereby allows powerful features to append, add, remove files on the fly. The plugin also has added DRAG & DROP support for ajax uploads. In the event, the browser does not support FormData or XHR2, the plugin degrades it to a normal form submission.
Load all the respective locale JS files for the locale languages you need (e.g.
fileinput_locale_ru.js for Russian). These must be loaded after the
language property in the plugin as shown below.
truewith a proper maxFileCount setting. For restricting to single (ONE) file uploads, in addition to setting maxFileCount to
1, do NOT SET the
multipleattribute of the file input (to prevent multiple selections).
true. This can be validated for both ajax uploads (with uploadUrl) and non-ajax uploads (without
You need to read and setup the ajax server methods to correctly parse and return the right response via AJAX.