?
Solved

what's wrong with my Javascript code?

Posted on 2006-04-20
19
Medium Priority
?
249 Views
Last Modified: 2012-06-22
<HTML>
<HEAD>
<TITLE>Texture Displace Drawing</TITLE>
</HEAD>
<BODY BGCOLOR="#000000" TEXT="#00FF00" LINK="#FFFFFF" VLINK="#C0C0C0">
<div id="hidden_layer" style="position:absolute; left:0px; top:0px; width:100px; height:50px; z-index:2; overflow: hidden; visibility: hidden;">
      <iframe id="uploadPane"  src="hidden_form.htm" width=100 height=50 allowtransparency=true frameborder="no" ></iframe>
</div>
<script language="JavaScript" type="text/JavaScript">
function select_file(){      
      hidden_layer_element = window.document.getElementById("hidden_layer")
      uploadPane_element = hidden_layer_element.document.getElementById("uploadPane")
                  uploadPane_element.contentWindow.uploadimage.file.click()
}
function refreshme(){
      //alert("refresh")
      //location.reload()
}
</script>

<OBJECT
    CLASSID="CLSID:C4925E65-7A1E-11D2-8BB4-00A0C9CC72C3"
    ID="Virtools" WIDTH="800" HEIGHT="600"
    CODEBASE="http://a532.g.akamai.net/f/532/6712/4h/player.virtools.com/downloads/player/Install3.0/Installer.exe#Version=3,5,0,24">
    <PARAM NAME="SRC" VALUE="TextureDisplaceDraw.vmo">
    <EMBED
        SRC="TextureDisplaceDraw.vmo"
        TYPE="application/x-virtools"
        PLUGINSPAGE="http://player.virtools.com/"
        WIDTH="800" HEIGHT="600"
        NAME="Virtools">
    </EMBED>
</OBJECT>
</BODY>
</HTML>

error

uploadPane_element.contentWindow.uploadimage.file is null


any hints?


0
Comment
Question by:gorexy
  • 9
  • 9
19 Comments
 
LVL 9

Expert Comment

by:smaccari
ID: 16496221
Could you post the code from your hidden_form.htm page?
0
 
LVL 15

Expert Comment

by:deepaknet
ID: 16496228
Try this

uploadPane_element = document.getElementById("uploadPane")

(I don't think you need to prefix a DIV)
0
 

Author Comment

by:gorexy
ID: 16496239
I modify this

function select_file(){      
      hidden_layer_element = window.document.getElementById("hidden_layer")
               uploadPane_element = document.getElementById("uploadPane")
                 uploadPane_element.contentWindow.uploadimage.file.click()
}

but still same error
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 9

Expert Comment

by:smaccari
ID: 16496249
I think the problem comes from the code in your hidden_form.htm page.
Could we take a look at it?
0
 

Author Comment

by:gorexy
ID: 16496269
here is

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
</head>
<body>      
<form method="post" name="uploadimage" enctype="multipart/form-data" action="http://localhost/vtuploadimage.php" >
    <input type="file" name="file" onchange="upload_file()">
</form>      
<script language="javascript">
function upload_file(){
      upload_element = document.getElementById("uploadimage")
      upload_element.submit()      
      window.parent.refreshme()
}
</script>
</body>
</html>
0
 
LVL 9

Expert Comment

by:smaccari
ID: 16496277
Ok try this:

function select_file(){    
     hidden_layer_element = window.document.getElementById("hidden_layer")
               uploadPane_element = document.getElementById("uploadPane")
                 uploadPane_element.contentWindow.document.forms["uploadimage"].elements["file"].click()
}
0
 

Author Comment

by:gorexy
ID: 16496283
erroe

element is null
0
 
LVL 9

Expert Comment

by:smaccari
ID: 16496288
Ok so use this:

function select_file(){    
     hidden_layer_element = window.document.getElementById("hidden_layer")
               uploadPane_element = frames["uploadPane"]
                 uploadPane_element.document.forms["uploadimage"].elements["file"].click()
}

And add the name attribute in your iframe tag:

<iframe id="uploadPane" name="uploadPane"  src="hidden_form.htm" width=100 height=50 allowtransparency=true frameborder="no" ></iframe>
0
 

Author Comment

by:gorexy
ID: 16496299
like this?


<HTML>
<HEAD>
<TITLE>Texture Displace Drawing</TITLE>
</HEAD>
<BODY BGCOLOR="#000000" TEXT="#00FF00" LINK="#FFFFFF" VLINK="#C0C0C0">
</div>
<iframe id="uploadPane" name="uploadPane"  src="hidden_form.htm" width=100 height=50 allowtransparency=true frameborder="no" ></iframe>
<script language="JavaScript" type="text/JavaScript">
function select_file(){      
      //hidden_layer_element = window.document.getElementById("hidden_layer")
           //uploadPane_element = hidden_layer_element.document.getElementById("uploadPane")
                 
            //       uploadPane_element.contentWindow.uploadimage.file.click()

   
     hidden_layer_element = window.document.getElementById("hidden_layer")
               uploadPane_element = document.getElementById("uploadPane")
                 uploadPane_element.contentWindow.document.forms["uploadimage"].elements["file"].click()

}
function refreshme(){
      //alert("refresh")
      //location.reload()
}
</script>
0
 
LVL 9

Expert Comment

by:smaccari
ID: 16496315
<HTML>
<HEAD>
<TITLE>Texture Displace Drawing</TITLE>
</HEAD>
<BODY BGCOLOR="#000000" TEXT="#00FF00" LINK="#FFFFFF" VLINK="#C0C0C0">
</div>
<iframe id="uploadPane" name="uploadPane"  src="hidden_form.htm" width=100 height=50 allowtransparency=true frameborder="no" ></iframe>
<script language="JavaScript" type="text/JavaScript">
function select_file(){    
     hidden_layer_element = window.document.getElementById("hidden_layer")
               uploadPane_element = frames["uploadPane"]
                 uploadPane_element.document.forms["uploadimage"].elements["file"].click()
}

function refreshme(){
     //alert("refresh")
     //location.reload()
}
</script>
0
 

Author Comment

by:gorexy
ID: 16496328
uploadPane_element.contentWindow.uploadimage.file is null


same error
0
 

Author Comment

by:gorexy
ID: 16496332
the error occured when I call select_file twice,

for the first time, it is ok
just call again, error occur
0
 
LVL 9

Expert Comment

by:smaccari
ID: 16496349
Ok it looks like you auto submit the form with the onchange handler of your input file.
So the page in the frame has changed, and there is no more form (i suppose).
0
 

Author Comment

by:gorexy
ID: 16496353
hm..so any other hints?
can fix?
0
 
LVL 9

Expert Comment

by:smaccari
ID: 16496369
What do you need to do exactly?
I suppose that a fix would be to include include your html code with the form and the input file in the page where your form is post - your vtuploadimage.php page.
0
 

Author Comment

by:gorexy
ID: 16496389
hm..do u mind I send you the whole stuff?
0
 
LVL 9

Expert Comment

by:smaccari
ID: 16496576
Mmm let's try this.
Change your main page with this: (add an iframe for posting)

<HTML>
<HEAD>
<TITLE>Texture Displace Drawing</TITLE>
</HEAD>
<BODY BGCOLOR="#000000" TEXT="#00FF00" LINK="#FFFFFF" VLINK="#C0C0C0">
<div id="hidden_layer" style="position:absolute; left:0px; top:0px; width:100px; height:50px; z-index:2; overflow: hidden; visibility: hidden;">
     <iframe id="uploadPane" name="uploadPane"  src="hidden_form.htm" width=100 height=50 allowtransparency=true frameborder="no" ></iframe>
<iframe id="submitPane"  name="submitPane" width=1 height=1 frameborder="no" ></iframe>
</div>
<script language="JavaScript" type="text/JavaScript">
function select_file(){    
     uploadPane_element = frames["uploadPane"]
     uploadPane_element.document.forms["uploadimage"].elements["file"].click()
}
function refreshme(){
     //alert("refresh")
     //location.reload()
}
</script>

<OBJECT
    CLASSID="CLSID:C4925E65-7A1E-11D2-8BB4-00A0C9CC72C3"
    ID="Virtools" WIDTH="800" HEIGHT="600"
    CODEBASE="http://a532.g.akamai.net/f/532/6712/4h/player.virtools.com/downloads/player/Install3.0/Installer.exe#Version=3,5,0,24">
    <PARAM NAME="SRC" VALUE="TextureDisplaceDraw.vmo">
    <EMBED
        SRC="TextureDisplaceDraw.vmo"
        TYPE="application/x-virtools"
        PLUGINSPAGE="http://player.virtools.com/"
        WIDTH="800" HEIGHT="600"
        NAME="Virtools">
    </EMBED>
</OBJECT>
</BODY>
</HTML>


And in your hidden_form.htm:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
</head>
<body>    
<form method="post" name="uploadimage" enctype="multipart/form-data" action="http://localhost/vtuploadimage.php" target="submitPane">
    <input type="file" name="file" onchange="upload_file()">
</form>    
<script language="javascript">
function upload_file(){
     upload_element = document.getElementById("uploadimage")
     upload_element.submit()    
     window.parent.refreshme()
}
</script>
</body>
</html>
0
 

Author Comment

by:gorexy
ID: 16496668
oh...it works!

can you explain what happen?
I dig out for long time but getno solution
0
 
LVL 9

Accepted Solution

by:
smaccari earned 80 total points
ID: 16496838
The problem was that you submitted the form in your iframe, thus changing the page in it, and thus loosing your form (that's why you had the error).
In my code, i submit the form in another iframe. In this case, as the page will remain in the first iframe, no more problem to access several times to your form.

Hope am clear ;)
0

Featured Post

Important Lessons on Recovering from Petya

In their most recent webinar, Skyport Systems explores ways to isolate and protect critical databases to keep the core of your company safe from harm.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

840 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question