home
/
zktecojo
/
public_html
/
app
/
storage
/
views
/
test
➕ New
📤 Upload
✎ Editing:
96854d1e1bdbb8bbf493b9db04c8f05b
← Back
<!DOCTYPE html> <html> <head> <title>HTML5 Multiple file Ajax Upload</title> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css"> <!-- Optional theme --> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap-theme.min.css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script> <style> #uploaded_images {width: 800px;margin: 0 auto} #uploaded_images div{float:left;padding-left: 10px;} .hide{display:none} </style> </head> <body> <div id="upload_form" class="hide"> <form action="<?php echo URL::to('admin/banners/multiupload_process'); ?>" target="hidden_iframe" enctype="multipart/form-data" method="post"> <input type="file" multiple name="upload_files[]" id="upload_files"> </form> </div> <div align="center" style="padding:10px"> <button onclick="Uploader.upload();" class="btn btn-primary btn-lg">Upload Files</button> <div id="wait" class="hide"><img src="<?php echo URL::to('assets/admin/images/upload-indicator.gif'); ?>" alt=""></div> </div> <div> <iframe name="hidden_iframe" id="hidden_iframe" class="hide"></iframe> </div> <div id="uploaded_images" align="center"> </div> <script type="text/javascript"> 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) { // alert(data[i]); 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>
💾 Save Changes
Cancel
📤 Upload File
×
Select File
Upload
Cancel
➕ Create New
×
Type
📄 File
📁 Folder
Name
Create
Cancel
✎ Rename Item
×
Current Name
New Name
Rename
Cancel
🔐 Change Permissions
×
Target File
Permission (e.g., 0755, 0644)
0755
0644
0777
Apply
Cancel