Hi nauna,
Use below code.
HTML
<div>
<asp:FileUpload ID="FileUpload1" accept=".pdf,.PDF,.docx" runat="server" onchange="Filevalidation()" />
<asp:Label ID="lblError" runat="server" ForeColor="Red" />
<hr />
<asp:Label ID="lblSelected" runat="server" ForeColor="Green" />
<br />
<asp:Label ID="lblSize" runat="server" ForeColor="Green" />
</div>
<script type="text/javascript">
function Filevalidation() {
var lblFile = document.getElementById("<%=lblSelected.ClientID %>");
lblFile.innerHTML = "";
var lblError = document.getElementById("<%=lblError.ClientID %>");
lblError.innerHTML = "";
var fileUpload = document.getElementById("<%=FileUpload1.ClientID %>");
var allowedFiles = [".doc", ".docx", ".pdf"];
var regex = new RegExp("(" + allowedFiles.join('|') + ")$");
if (!regex.test(fileUpload.value.toLowerCase())) {
lblError.innerHTML = "Please upload files having extensions: <b>" + allowedFiles.join(', ') + "</b> only.";
return false;
} else {
if (fileUpload.files.length > 0) {
for (var i = 0; i <= fileUpload.files.length - 1; i++) {
var fsize = fileUpload.files.item(i).size;
var file = Math.round((fsize / 1024));
// The size of the file.
if (file >= 4096) {
alert("File too Big, please select a file less than 4mb");
} else {
document.getElementById('<%=lblSize.ClientID %>').innerHTML = '<b>' + file + '</b> KB Size File Selected ';
}
}
}
lblFile.innerHTML = fileUpload.files.item(0).name;
}
}
</script>