I have written this code for uploading files using Ajax and PHP, and I am looking to incorporate a progress bar to indicate the percentage of the upload.
Here is the code snippet:
<script>
$("form#data").submit(function(){
var formData = new FormData($(this)[0]);
$.ajax({
url: "functions/video.php",
type: 'POST',
data: formData,
async: false,
success: function (data) {
document.getElementById("status").innerHTML = data;
},
cache: false,
contentType: false,
processData: false
});
return false;
});
</script>
<form id="data" method="post" enctype="multipart/form-data">
<input name="up_vid" type="file" id="up_vid"/>
<div class="upload_v_icon"></div>
<div class="video_info">
<input type="text" name="video_title" placeholder="Video title" />
<input type="text" name="tags" placeholder="funny,9gag,nice,crazy ..."/>
<textarea name="description" placeholder="Description"></textarea>
</div>
<div class="bg_upload">
<p>By uploading this video, you agree with our <a href="">Terms</a> of service.</p>
<button>Begin Upload</button>
</div>
</form>
Thank you for your attention.