tags:

views:

86

answers:

2
Q: 

How to call a javascript function after the selection of file from the Open Dialog window close event. in HTMLusing html file type="file" 

<html>
<body>
    <script language="javascript">
    document.getElementById('myfileId').onchange = function(e) { alert('change'); }
    </script>

    <form action="" >
        <input type="file"  id="myfileId" name="myfile">
    </form>

    </body>
</html>

How can I call the JavaScript function after a file selection.

Edit: 1

<html>
<body>

    <form>
        <input type="file"  id="myfileId" name="myfile">
    </form>
 <script language="javascript">
  window.onload = function() 
        { 
    alert("Test");

    document.getElementById('myfileId').onblur =  function(e) { alert('change'); }
        }
    </script>
    </body>
</html>
+8  A: 

You have to put that <script> after the <input>. The document.getElementById('myfileId') does not exist if you put it before, so it will return nothing.

KennyTM  2010-05-10 19:22:53
@coderex: How it's not working?
KennyTM  2010-05-10 19:26:54
@coderex: Not reproducible. Hint: You need to close (confirm) the file choosing dialog to see the alert.
KennyTM  2010-05-10 19:31:27
Change events tend to fire when focus is lost, not as soon as a change is made.
David Dorward  2010-05-10 19:31:39
@KennyTM the onchange is not wrking any morreee
coderex  2010-05-10 19:31:58
@KennyTM check my edit section I added my latest code. you can check and let me know whats wrong
coderex  2010-05-10 19:34:42
@coderex: Still works. Note that with `onblur` you need to click outside of the `<input>` to fire.
KennyTM  2010-05-10 19:41:23
@KennyTM how can i trigger a JavaScript function, after file selection. ? Any option for that. ?
coderex  2010-05-10 19:43:03
+2  A: 

As @Kenny says, you have to either put the script after the input declaration so the element actually exists when the script is executed, or alternatively, add the function to the document's onload event:

window.onload = function() 
        { document.getElementById('myfileId').onchange =  
          function(e) { alert('change'); }
        }
Pekka  2010-05-10 19:25:37

related questions

Autosizing Textarea
Regular expression for parsing links from a webpage?
What are good tools for creating compiled HTML help files (.chm)?
Looking for WYSIWYG HTML editor
Any reason not to start using the HTML 5 doctype?
HTML comments break down
HTML Comments Markup
Setting a div's height in HTML with CSS
Wrapping lists into columns
Is a "Confirm Email" input good practice when user changes email address?
<XMP> Tag
HTML version choice
Options for HTML scraping?
How do you disable browser Autocomplete on web form field / input tag?
How do I make a checkbox toggle from clicking on the text label as well?
Html CSS Editor
Wordpress theme development offline tools
How do I give my web sites an icon for iPhone?
In HTML, how to word-break on a dash?
Detecting font in JavaScript
How do you test layout design across multiple browsers/OSs?
How do I print an HTML document from a web service?
Multiple submit buttons on a HTML form
How can I determine a web user's time zone?
Why doesn't the percentage width child in absolutely positioned parent work in IE7?