Re: Upload and Preview Image with Javascript with making any server calls

Message-ID	<1536067.bQIZT9NqMh@PointedEars.de> (permalink)
From	Thomas 'PointedEars' Lahn <PointedEars@web.de>
Organization	PointedEars Software (PES)
Date	2011-11-09 02:51 +0100
Subject	Re: Upload and Preview Image with Javascript with making any server calls
Newsgroups	comp.lang.javascript
References	<10505808.1085.1320594668508.JavaMail.geo-discussion-forums@yqhd1> <2bd2fc51-c63d-4570-9aca-9f657105bc6e@e15g2000vba.googlegroups.com> <18283602.430.1320801685563.JavaMail.geo-discussion-forums@yqie15>
Followup-To	comp.lang.javascript

Followups directed to: comp.lang.javascript

Show all headers | View raw

kiran wrote:

> Thanks Micheal and Elegie for replying.I have been spending quite sometime
> now on this.My head is starts paining when i think about this for lack of
> options for further thoughts.

So does mine when I try to make sense of your postings.  You could at least 
*try* to post something easily readable.  Or is that already too much to ask 
for from a Google Groups user?

<http://www.catb.org/~esr/faqs/smart-questions.html>
<http://www.netmeister.org/news/learn2quote.html>
<http://jibbering.com/faq/notes/posting>

> Anyways,here is code, I wrote,
> 
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
> 
> <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US">

1. Don't declare and use XHTML unless you really understand and need it.
   Declare and use HTML.

2. If you declare XHTML, make it *Valid* at least.

<http://validator.w3.org/>

> <html>
> 
> <head>
> 
> <title>file upload trial</title>
> 
> <style type="text/css">
> 
> div.clmaincontainer{
> 
>   width:30%;
> 
>   height:600px;

3. Don't use pixel-sized widths or heights unless necessary.

>   border-style:solid;

Since the initial border width is 0, this is pointless.

>   }
> 
> div.climg{
> 
> width:30%;
> 
> height:auto;

`auto' is the initial value.

> border-style:inset;

Again, pointless.  There is no border.

>  
> 
> }
> 
> </style>
> 
> </head>

Not Valid.

> <body>
> 
> <div id="idmaincontainer" class="clmaincontainer">
> 
> <input type="file" name="img" id="idimgupload"
> class="climgupload"/><br></br>
> 
> <img src="" type="image/JPEG" id="my_img" class="climg">your uploaded

MIME types are registered lowercase.

> image</img>

Not Valid (X)HTML.  The `img' element has the content model EMPTY.

> <div id="idimgdisplay" class="climgdisplay">
> 
> </div>
> 
> </div>
> 
> <script
> 
src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>

1. Do not use jQuery 1.5.  The current version is 1.7.
2. Do not use jQuery from somewhere; download it to your webspace instead.
3. Do not use jQuery at all.  Pretty junk is still junk.

> <script>

Not Valid XHTML 1.0.

> […]
> 
> </html>
> 
> This works perfectly fine in IE7,8,9 and FF 7.01 version.

Doubtful.  If so, then by sheer coincidence.

> All I need to do it add my site to trusted sites and enable IE show the
> directory path while uploading files.

If you expect your users to do the same, you are most certainly mistaken.

> Now strange thing here is that it works in my
> office FF7.01 version and does not work on my local laptop version.

"Does not work" is not an error description.

<http://jibbering.com/faq/>

> So I believe there is something which needs to tweaked to make it works
> and definitey now a code issue.

The problem is primarily due to the fact that you have not the slightest 
idea what you are doing but you are not aware of it.

> I am using jquery here, but I am definitely open to plain JS or any other
> libaries which help me here.I would be gratefull to you all for your
> thoughts and suggestions.

You cannot work around security restrictions.  You can only lower security 
settings, or you can use the proper API.  The File API has nothing to do 
with HTML5 to begin with.

<http://www.w3.org/TR/FileAPI/>

PointedEars
-- 
    realism:    HTML 4.01 Strict
    evangelism: XHTML 1.0 Strict
    madness:    XHTML 1.1 as application/xhtml+xml
                                                    -- Bjoern Hoehrmann

Thread

Upload and Preview Image with Javascript with making any server calls kiran <kiranmbadi@gmail.com> - 2011-11-06 07:51 -0800
  Re: Upload and Preview Image with Javascript with making any server calls kiran <kiranmbadi@gmail.com> - 2011-11-07 16:27 -0800
  Re: Upload and Preview Image with Javascript with making any server calls Elegie <elegie@anonymous.invalid> - 2011-11-08 10:06 +0100
  Re: Upload and Preview Image with Javascript with making any server calls "Michael Haufe (TNO)" <tno@thenewobjective.com> - 2011-11-08 04:51 -0800
    Re: Upload and Preview Image with Javascript with making any server calls kiran <kiranmbadi@gmail.com> - 2011-11-08 17:21 -0800
      Re: Upload and Preview Image with Javascript with making any server calls Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2011-11-09 02:51 +0100
    Re: Upload and Preview Image with Javascript with making any server calls kiran <kiranmbadi@gmail.com> - 2011-11-08 17:22 -0800
      Re: Upload and Preview Image with Javascript with making any server calls kiran <kiranmbadi@gmail.com> - 2011-11-08 19:20 -0800

csiph-web