Asp.net programming we consider all important topic for knowledge about controls,web Services, JSON, Ajax, database, and interview related Question. In this Asp.net and sql server tutorial blog we give many examples of jquery as like How Play YouTube Video in Your Asp.net Website by URL, How to Play YouTube Videos in Asp.net by using Jquery , Jquery Change div background on mouseover in asp.net , JQuery UI Datepicker (Calendar) etc.

Friday, July 4, 2014

How to check image size before uploading on server

How to check image size before uploading on server:

How to check image size in Asp.net Programming is very important Question in web development, many time we seen that some web site give the restriction for the uploading image .for this here we give some code for the web developer that they make this type of application easily.  
In Asp.net we use this code as like we give here. if you want this type of program the simple copy this and past in aspx page here no need to the aspx.cs code this work by the java script Programming.



Click on Choose file button and click on the button:





 Code of Asp.net Page :

<html>
<head runat="server">
<title></title>
<style type='text/css'>
body
{
font-family: sans-serif;
}
</style>
<script type='text/javascript'>

function loadImage() {
var input, file, fr, img;

if (typeof window.FileReader !== 'function') {
write("The file API isn't supported on this browser yet.");
return;
}

//input = document.getElementById('imgfile');
input = document.getElementById('<%=fuFile.ClientID%>');
if (!input) {
write("Um, couldn't find the imgfile element.");
}
else if (!input.files) {
write("This browser doesn't seem to support the `files` property of file inputs.");
}
else if (!input.files[0]) {
write("Please select a file before clicking 'Load'");
}
else {
file = input.files[0];
fr = new FileReader();
fr.onload = createImage;
fr.readAsDataURL(file);
}

function createImage() {
img = document.createElement('img');
img.onload = imageLoaded;
img.style.display = 'none'; // If you don't want it showing
img.src = fr.result;
document.body.appendChild(img);
}

function imageLoaded() {
write(img.width + "x" + img.height);

write("The size of file '" + file.name + "' is " + file.size + " bytes");
// This next bit removes the image, which is obviously optional -- perhaps you want
// to do something with it!
img.parentNode.removeChild(img);
img = undefined;
}

function write(msg) {
var p = document.createElement('p');
p.innerHTML = msg;
document.body.appendChild(p);
}
}

</script>
</head>
<body>
<form id="form1" runat="server" action='#' onsubmit="return false;">
<div>
<asp:FileUpload ID="fuFile" runat="server" />
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="loadImage();" />
</div>
</form>
</body>
</html>




download code here by .Net Programming:

Related Post:

  1. Asp.Net Check file size before upload
  2. How to check the fixed image size with uploaded image
  3. Determining the Dimensions of Uploaded Images in ASP.NET
  4. Checking Image Size in ASP.NET - C#, ASP.Net
  5. Validate Image dimension when uploading in ASP.Net Programming