html code:
<html>
<div>
<label for="fileToUpload">1. Fotoğrafınızı seçiniz ve ardından yükleyiniz...</label><br />
<input type="file" name="fileToUpload" id="fileToUpload" accept="image/*" onchange="fileSelected();" enctype="multipart/form-data" />
</div>
<div id="details"></div>
<div>
<input type="button" onclick="uploadFile()" value="1. Fotoğrafı Yüklemek için Tıklayınız" />
</div>
<div id="progress"></div>
<div class="submit_div" disabled="disabled" >
<div id="next">
<button name="sys_next_button" id="next_button" class="graphical_next_button"><div id="page_submit_msg" class="new_tooltip">Submit this page to apply the Test Options set above.</div></button></div>
</div>
</html>
javascript:
<script>
function fileSelected() {
var count = document.getElementById('fileToUpload').files.length;
document.getElementById('details').innerHTML = "";
for (var index = 0; index < count; index ++)
{
var file = document.getElementById('fileToUpload').files[index];
var fileSize = 0;
if (file.size > 1024 * 1024)
fileSize = (Math.round(file.size * 100 / (1024 * 1024)) / 100).toString() + 'MB';
else
fileSize = (Math.round(file.size * 100 / 1024) / 100).toString() + 'KB';
document.getElementById('details').innerHTML += '<p>';
}
}
function uploadFile() {
var fd = new FormData();
var count = document.getElementById('fileToUpload').files.length;
for (var index = 0; index < count; index ++)
{
var file = document.getElementById('fileToUpload').files[index];
fd.append('myFile', file);
}
var xhr = new XMLHttpRequest();
xhr.upload.addEventListener("progress", uploadProgress, false);
xhr.addEventListener("load", uploadComplete, false);
xhr.addEventListener("error", uploadFailed, false);
xhr.addEventListener("abort", uploadCanceled, false);
xhr.open("POST", "../upload/savetofile1.php?sifre=[%pass%]_1");
xhr.send(fd);
}
function uploadProgress(evt) {
if (evt.lengthComputable) {
var percentComplete = Math.round(evt.loaded * 100 / evt.total);
document.getElementById('progress').innerHTML = percentComplete.toString() + '%';
}
else {
document.getElementById('progress').innerHTML = 'unable to compute';
}
}
function uploadComplete(evt) {
/* This event is raised when the server send back a response */
alert(evt.target.responseText);
}
function uploadFailed(evt) {
alert("There was an error attempting to upload the file.");
}
function uploadCanceled(evt) {
alert("The upload has been canceled by the user or the browser dropped the connection.");
}
</script>
