Bootstrap File Input Demo

Thankful to Krajee!
to get more out of us.

Extension of scenario 5 to trigger auto upload immediately after files are dragged & dropped (OR when files are selected via browse button). Note that the filebatchselected event is used to trigger the auto upload. We will HIDE the upload and remove buttons for this scenario. Like scenario 5, this incorporates synchronous batch uploads in which you can dynamically setup the initialPreview and initialPreviewConfig immediately after upload at runtime. For this you must return the initialPreview, initialPreviewConfig, and append properties within a JSON object from your server. Refer to the documentation for receiving data on server or sending data from server in synchronous mode.


Code

<div class="file-loading">
    <input id="input-705" name="kartik-input-705[]" type="file" multiple>
</div>

<script>
$(document).on("ready", function() {
var $el1 = $("#input-705");
$el1.fileinput({
    uploadUrl: "/file-upload-batch/2",
    uploadAsync: false,
    showUpload: false, // hide upload button
    showRemove: false, // hide remove button
    minFileCount: 1,
    maxFileCount: 5,
    initialPreviewAsData: true
}).on("filebatchselected", function(event, files) {
    $el1.fileinput("upload");
});
});
</script>

Note

You can now visit the Krajee Webtips Q & A forum for searching OR asking questions OR helping programmers with answers on these extensions and plugins. For asking a question click here. Select the appropriate question category (i.e. Krajee Plugins) and choose this current page plugin in the question related to field.

The comments and discussion section below are intended for generic discussions or feedback for this plugin. Developers may not be able to search or lookup here specific questions or tips on usage for this plugin.