In this tutorial we will discuss file upload size validation using jquery.
Also Read:
- How to display image onChnage the select option using jQuery
- How to Insert Data using PHP Ajax
- How to Insert Multiple Data in PHP using Ajax
In this tutorial if we upload File which size is greater than 300kb it give a message.
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#filePHOTO").change(function(){
$("#file_error").html("");
class="ezoic-autoinsert-ad ezoic-under_first_paragraph">"clear:both;display:block" id="ez-clearholder-medrectangle-3">class="ezoic-ad ezoic-at-0 medrectangle-3 medrectangle-3320 adtester-container adtester-container-320" data-ez-name="studentstutorial_com-medrectangle-3">"div-gpt-ad-studentstutorial_com-medrectangle-3-0" ezaw="728" ezah="90" style="position: relative; z-index: 0; display: inline-block; padding: 0px; min-height: 90px; min-width: 728px; width: 100%;" class="ezoic-ad">
$(".file_upload1").css("border-color","#F0F0F0");
var file_size = $('#filePHOTO')[0].files[0].size;
if(file_size>300000) {
$("#file_error").html("<p style='color:#FF0000'>File size is greater than 300kb</p>");
$(".file_upload1").css("border-color","#FF0000");
return false;
}
return true;
});
});
</script>
</head>
<body>
<span id="file_error"></span>
<input type="file" id="filePHOTO" name="file_upload1" class="file_upload1">
</body>
</html>
0 Comments