Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 12 of 12
  1. #1
    New Coder
    Join Date
    Oct 2002
    Location
    Holy Land
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How 2 get dimensions of a JPG file

    Dear all.

    How can I get the dimensions (width & height) from a JPG file using ASP ?

    for example: the user uploads a JPG file to my server and I want to only accept it if it is in the size of 800x600
    (can I do it using JavaScript before it uploads ?)

    Thanks in advanced, Yovav.
    ··(Tip): 2 get code from this page - paste it in2 WordPad and then in2 NotePad...
    ··
    ··Best Regards - Yovav Gad
    ··EMail: Dev@GadWorks.com
    ··Web-Site: www.GadWorks.com

  • #2
    Senior Coder Mhtml's Avatar
    Join Date
    Jun 2002
    Location
    Sydney, Australia
    Posts
    3,531
    Thanks
    0
    Thanked 1 Time in 1 Post
    As far as I know this cannot be done client side like that. Why not use ASP for it?
    Omnis mico antequam dominus Spookster!

  • #3
    Banned
    Join Date
    Sep 2003
    Posts
    3,620
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You can easily find the height and width of an image using
    javascript. I don't know anything about ASP. Maybe you will
    have better luck if this question was moved to that forum.

    But in javascript you would do something like this:

    <body>
    <img src="http://THE_IMAGE_FILE.jpg">
    <br>
    <script type="text/javascript">
    wdt=document.images[0].width;
    ht=document.images[0].height;
    sc=document.images[0].src;
    document.write('width='+wdt+' height='+ht);
    </script>

    .....Willy

  • #4
    New Coder
    Join Date
    Oct 2002
    Location
    Holy Land
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Maybe I found something:
    http://www.asp101.com/forum/display_...asp?mid=105372

    but it only check the picture after it was uploaded...

    +

    1. How can I resize a picture - on the client or on the server ?
    (but keep it look good and smooth...)

    2. is there a way I can check the size of the picture before the user uploads it,
    so I don't have to upload pictures that are not in the alowed size ?
    ··(Tip): 2 get code from this page - paste it in2 WordPad and then in2 NotePad...
    ··
    ··Best Regards - Yovav Gad
    ··EMail: Dev@GadWorks.com
    ··Web-Site: www.GadWorks.com

  • #5
    Senior Coder
    Join Date
    Jun 2002
    Posts
    1,404
    Thanks
    2
    Thanked 32 Times in 32 Posts
    Haven't really tested this, so...
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" 
        "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>untitled</title>
    <script type="text/javascript" language="javascript">
    
    function check_img(img_file)
    {
    	var testObj = new Image();
    	testObj.onload = function()
                             {
    			       report(this);
                             }
    	testObj.src = img_file;
    }
    
    function report(testObj)
    {
    	if (testObj.width != 800 || testObj.height != 600)
    	{
    		alert('That image is not 800 x 600, the required size. Please choose another.');
    		document.forms[0].image_url.select();
    		return false;
    	}
    	else return true;
    }
    
    </script>
    </head>
    <body>
    <form action="javascript&#58;alert('sent')" method="post" enctype="multipart/form-data">
    <input type="file" name="image_url" onblur="return check_img(this.value)">
    </form>
    </body>
    </html>

  • #6
    New Coder
    Join Date
    Oct 2002
    Location
    Holy Land
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts

    What a COOL code!!!

    Hay 10X man!

    it does work and recognize the size,

    Now I only have 2 figure out how to change the action=""
    to the correct ASP page if size is good,
    and to allow only some picture extentions (JPG, JPEG, GIF, PNG)

    do U have an idea how 2 do this 2 ?

    +

    can I also get the file size before uploading it ?


    Anyway, Thanks for this amazing code :-)
    ··(Tip): 2 get code from this page - paste it in2 WordPad and then in2 NotePad...
    ··
    ··Best Regards - Yovav Gad
    ··EMail: Dev@GadWorks.com
    ··Web-Site: www.GadWorks.com

  • #7
    Senior Coder
    Join Date
    Jun 2002
    Posts
    1,404
    Thanks
    2
    Thanked 32 Times in 32 Posts
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" 
        "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>untitled</title>
    <script type="text/javascript" language="javascript">
    
    function check_img(oInput)
    {
    	if (oInput.value != '' && !/\.(JPG|JPEG|GIF|PNG)$/i.test(oInput.value))
    	{
    		var sMsg = '';
    		var badtype = oInput.value.match(/\.\w+$/i);
    		if (badtype == null)
    			sMsg += 'Invalid file type.';
    		else sMsg += 'You have selected an image file of type "' + badtype + '" to upload.'; 
    		sMsg += '\nOnly the following file types are permitted:';
    		sMsg += '\n\n\t.JPG\n\t.JPEG\n\t.GIF\n\t.PNG\n\nThank you.';
    		alert(sMsg);
    		oInput.select();
    		return false;
    	}
    	var testObj = new Image();
    	testObj.onload = function()
                             {
    			       report(this);
                             }
    	testObj.src = oInput.value;
    }
    
    function report(testObj)
    {
    	if (testObj.width != 800 || testObj.height != 600)
    	{
    		alert('That image is not 800 x 600, the required size. Please choose another.');
    		document.forms[0].image_url.select();
    		return false;
    	}
    	else return true;
    }
    
    </script>
    </head>
    <body>
    <form action="javascript&#58;alert('sent')" method="post" enctype="multipart/form-data">
    <input type="file" name="image_url" onchange="return check_img(this)">
    </form>
    </body>
    </html>
    Programming file input controls is iffy; never know what to expect. Tested mozilla Firebird/NS7, IE6. Might want to shop it around a bit. The javascript&#58; url is strictly for demo; put a real action in ther when using. File size is iffy as well; possibly activeX...

    http://www.faqts.com/knowledge_base/...aid/1685/fid/1

  • #8
    New Coder
    Join Date
    Oct 2002
    Location
    Holy Land
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks !!!

    REAL great stuff :-)

    U left me with no more questions (4 now :-)
    ··(Tip): 2 get code from this page - paste it in2 WordPad and then in2 NotePad...
    ··
    ··Best Regards - Yovav Gad
    ··EMail: Dev@GadWorks.com
    ··Web-Site: www.GadWorks.com

  • #9
    New Coder
    Join Date
    Oct 2002
    Location
    Holy Land
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I do have another one (while U R hot...)


    do U know if I can also show the image (from the client) as a preview - before sending it ?
    (maybe using the picture object some how)


    I think I saw it somewhere but I can't remember where :-(
    ··(Tip): 2 get code from this page - paste it in2 WordPad and then in2 NotePad...
    ··
    ··Best Regards - Yovav Gad
    ··EMail: Dev@GadWorks.com
    ··Web-Site: www.GadWorks.com

  • #10
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,042
    Thanks
    0
    Thanked 251 Times in 247 Posts

  • #11
    Senior Coder
    Join Date
    Jun 2002
    Location
    Wichita
    Posts
    3,880
    Thanks
    0
    Thanked 0 Times in 0 Posts
    One warning: even if you implement a "client side" script like this to prevent users from uploading oversize images you still need a server side script to perform the same check. The "client side" script's purpose is to help the user check the image before they spend the extra time required to submit it while the server side script's purpose is to catch the same thing if a user has javascript turned off or is deliberately trying to bypass the client side size check.
    Check out the Forum Search. It's the short path to getting great results from this forum.

  • #12
    New Coder
    Join Date
    Oct 2002
    Location
    Holy Land
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Originally posted by Roy Sinclair
    One warning: even if you implement a "client side" script like this to prevent users from uploading oversize images you still need a server side script to perform the same check. The "client side" script's purpose is to help the user check the image before they spend the extra time required to submit it while the server side script's purpose is to catch the same thing if a user has javascript turned off or is deliberately trying to bypass the client side size check.

    Absolutely agreed.

    10Q All 4 the great info...
    ··(Tip): 2 get code from this page - paste it in2 WordPad and then in2 NotePad...
    ··
    ··Best Regards - Yovav Gad
    ··EMail: Dev@GadWorks.com
    ··Web-Site: www.GadWorks.com


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •