473,382 Members | 1,086 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,382 software developers and data experts.

get image side via client side script before file uplaod

I need to get the size on an image client side before the client uploads it,
and if its too large, I need to alert the client rather than doing a
postback. The code below successfully writes the file size to the
text-input element on the second click (attempt), but writes -1 on the first
click. It must return the file size on the first click to be useable. Can
anyone explain why it returns -1 on the first click and then the actual file
size on the second click, and also can you provide a good solution to this?

Thanks!

<%@ Page Language="vb" AutoEventWireup="false"
Codebehind="zzTestFileSize.aspx.vb" Inherits="Charmpix.zzTestFileSize"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title>zzTestFileSize</title>
<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
<meta content="Visual Basic .NET 7.1" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">
<meta content="http://schemas.microsoft.com/intellisense/ie5"
name="vs_targetSchema">

</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">

<script language="javascript" type="text/javascript">
function fromOnChange() {
var im;
im = new Image();
im.src = document.Form1.ctlFile.value;
document.Form1.txtTest.value = im.fileSize;
document.Form1.txtPath.value = im.src;
}
</script>

<INPUT type="file" id="ctlFile" name="ctlFile"> <INPUT type="button"
value="Button" onclick="fromOnChange()">
<INPUT type="text" id="txtTest"> <INPUT id="txtPath" type="text">
</form>
</body>
</HTML>



--
mo*******@nospam.com
Nov 18 '05 #1
2 1558
You will need a client-side executable to do this, such as an ActiveX
control or Java Applet.

--
HTH,
Kevin Spencer
..Net Developer
Microsoft MVP
Big things are made up
of lots of little things.

"moondaddy" <mo*******@nospam.com> wrote in message
news:#P**************@TK2MSFTNGP11.phx.gbl...
I need to get the size on an image client side before the client uploads it, and if its too large, I need to alert the client rather than doing a
postback. The code below successfully writes the file size to the
text-input element on the second click (attempt), but writes -1 on the first click. It must return the file size on the first click to be useable. Can
anyone explain why it returns -1 on the first click and then the actual file size on the second click, and also can you provide a good solution to this?
Thanks!

<%@ Page Language="vb" AutoEventWireup="false"
Codebehind="zzTestFileSize.aspx.vb" Inherits="Charmpix.zzTestFileSize"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title>zzTestFileSize</title>
<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
<meta content="Visual Basic .NET 7.1" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">
<meta content="http://schemas.microsoft.com/intellisense/ie5"
name="vs_targetSchema">

</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">

<script language="javascript" type="text/javascript">
function fromOnChange() {
var im;
im = new Image();
im.src = document.Form1.ctlFile.value;
document.Form1.txtTest.value = im.fileSize;
document.Form1.txtPath.value = im.src;
}
</script>

<INPUT type="file" id="ctlFile" name="ctlFile"> <INPUT type="button"
value="Button" onclick="fromOnChange()">
<INPUT type="text" id="txtTest"> <INPUT id="txtPath" type="text">
</form>
</body>
</HTML>



--
mo*******@nospam.com

Nov 18 '05 #2
Hi Moondaddy,

AS for image 's "fileSize" return -1 problem, I suspect that whether it is
caused by the image object is not completely loaded. Based on my research
,the image object contains a member property called "complete" which
indicate whether the image has been completely loaded or not. So I think we
can put a "If..." statement before we get the image's fileSize for example

if(im.complete== true)
{
alert(im.fileSize);
}

And here is a test page I've made and you can also have a test on your side
to see whether it works.
=================aspx page====================
<HTML>
<HEAD>
<title>CheckImageSize</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema"
content="http://schemas.microsoft.com/intellisense/ie5">
<script language="javascript">
var im;
function loadImage()
{
im = new Image();
im.src = document.getElementById("imgUploader").value;
}

function checkSize()
{
if(im!=null && im.complete == true)
{
alert(im.fileSize);
}
else
{
alert("not completely loaded!");
}
}
</script>
</HEAD>
<body>
<form id="Form1" method="post" runat="server">
<table width="100%" align="center">
<tr>
<td>
<INPUT id="imgUploader" type="file" onpropertychange="loadImage()">
</td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td>
<INPUT type="button" value="Check Image File Size"
onclick="checkSize()">
</td>
</tr>
</table>
</form>
</body>
</HTML>
=========================

Thanks.

Regards,

Steven Cheng
Microsoft Online Support

Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)

Get Preview at ASP.NET whidbey
http://msdn.microsoft.com/asp.net/whidbey/default.aspx

Nov 18 '05 #3

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

9
by: Kathryn | last post by:
Hiya I have a problem with using some client side and server side scripting together in an ASP. I'm using VBScript. What I'm trying to achieve is this - - Page loads up and some server side...
6
by: Ross M. Greenberg | last post by:
If I have a variable named 'fred', the contents looking like this: '/gif/picture1.gif', how can I display that image? Thanks! Ross
12
by: HarveyB | last post by:
I would like to generate non-modal popup windows from ASP.Net code-behind. I have tried using Client Side scripting like "function Test(){ window.open('test.htm',_blank,...
6
by: Olly | last post by:
I've found a basic script, however I also need to add alt and title attributes as well, how would I go about doing this? Here's the script I found: Thanks <script language="JavaScript"> <!--...
26
by: Don | last post by:
I'm writing an html page with some JavaScript that reads a web page into a client-side temp file, then reformats it, then submits that same file as a URL to the browser for display, via...
3
by: coolsti | last post by:
I need some help here. I am making an application which allows a user to look at a series of picture files one at a time, and enter the outcome of various visual tests to a database. The...
17
by: HornyLaBelle | last post by:
I'm hiding the email address on a website with this javascript which works fine: --------------------------------- <p>Send your comments and questions to our <script language=javascript> ...
11
by: Adam Sandler | last post by:
Hello, Having an issue with JavaScript in my ASP.Net page. I use some COTS, which for all intents and purposes, simply makes a jpeg file and physically places it in a directory on the web...
32
by: C. (http://symcbean.blogspot.com/) | last post by:
Hi all, I have an application which generates image graphs. These cache nicely at the client, however if the user submits more data, I'd like to force a reload of the image from the server. I...
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.