<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Upload</title>
</head>
<body>
<form id="myForm">
<label>File
<input name="fileupload" id="fileupload" type="file"></label>
</form>
<button id="submit">Submit</button>
<div id="progress"></div>
<pre id="display"></pre>
<script src="../js/jquery.min.js"></script>
<script src="../js/EventEmitter.min.js"></script>
<script src="../js/qfq.debug.js"></script>
<script>
var fileUpload = new QfqNS.FileUpload('#myForm', 'api/uploadhandler.php', 'the_sip');
fileUpload.on('fileupload.started', function () {
$('#progress').empty().append('<p>Upload started</p>');
});
fileUpload.on('fileupload.ended', function () {
$('#progress').append('<p>Upload finished</p>');
});
fileUpload.on('fileupload.upload.successful', function (obj) {
$('#progress').append('<p>Upload success</p>');
$('#display').empty().append(obj.data.file_content);
});
fileUpload.on('fileupload.upload.failed', function () {
$('#progress').append('<p>Upload made a booboo</p>');
});
$('#submit').click(function () {
$.post('upload.html', $('#myForm').serialize());
});
</script>
</body>
</html>