Admin Control Panel v2.0

✎ Editing: jsonupload2.blade.php ← Back

<!DOCTYPE html>

<html>

<head>

<title>HTML5 Multiple file Ajax Upload</title>

<style>

#uploaded_images {width: 800px;margin: 0 auto}

#uploaded_images div{float:left;padding-left: 10px;}

.hide{display:none}

</style>

</head>

<body>

</form>

</div>

<button onclick="Uploader.upload();" class="btn btn-primary btn-lg">Upload Files</button>

</div>

<div>

</div>

</div>

var Uploader = (function () {

jQuery('#upload_files').on('change', function () {

jQuery("#wait").removeClass('hide');

jQuery('#upload_files').parent('form').submit();

});

var fnUpload = function () {

jQuery('#upload_files').trigger('click');

}

var fnDone = function (data) {

var data = JSON.parse(data);

if (typeof (data['error']) != "undefined") {

jQuery('#uploaded_images').html(data['error']);

jQuery('#upload_files').val("");

jQuery("#wait").addClass('hide');

return;

}

var divs = [];

for (i in data) {

divs.push("<div><img src='" + data[i] + "' style='height:100px' class='img-thumbnail'></div>");

}

jQuery('#uploaded_images').html(divs.join(""));

jQuery('#upload_files').val("");

jQuery("#wait").addClass('hide');

}

return {

upload: fnUpload,

done: fnDone

}

}());

</script>

</body>

</html>

Cancel