I tried using an Ajax upload script as I don’t know to code one from http://www.jotform.org/jquery/ajax-multi-file-upload-with-progress-bar/#more-291 but it doesn’t work, can anyone give a fix for it? Or point me to a tutorial which explains in detail, so I can code one myself…?
index.html
[code]
<head>
<meta charset="utf-8"/>
<title></title>
<!-- Google web fonts -->
<link href="http://fonts.googleapis.com/css?family=PT+Sans+Narrow:400,700" rel='stylesheet' />
<!-- The main CSS file -->
<link href="assets/css/style.css" rel="stylesheet" />
</head>
<body>
<form id="upload" method="post" action="upload.php" enctype="multipart/form-data">
<div id="drop">
Drop Here
<a>Browse</a>
<input type="file" name="upl" multiple />
</div>
<ul>
<!-- The file uploads will be shown here -->
</ul>
</form>
<!-- JavaScript Includes -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="assets/js/jquery.knob.js"></script>
<!-- jQuery File Upload Dependencies -->
<script src="assets/js/jquery.ui.widget.js"></script>
<script src="assets/js/jquery.iframe-transport.js"></script>
<script src="assets/js/jquery.fileupload.js"></script>
<!-- Our main JS file -->
<script src="assets/js/script.js"></script>
</body>
Upload.php
[php]<?php
// A list of permitted file extensions
$allowed = array(‘png’, ‘jpg’, ‘txt’, ‘mp3’, ‘flac’, ‘doc’, ‘docx’);
if(isset($_FILES[‘upl’]) && $_FILES[‘upl’][‘error’] == 0){
$extension = pathinfo($_FILES['upl']['name'], PATHINFO_EXTENSION);
if(!in_array(strtolower($extension), $allowed)){
echo '{"status":"error"}';
exit;
}
if(move_uploaded_file($_FILES['upl']['tmp_name'], 'uploads/'.$_FILES['upl']['name'])){
echo '{"status":"success"}';
exit;
}
}
echo ‘{“status”:“error”}’;
exit;[/php]