Subscribe to geohhot's Blog        RSS Feed
-----

Making form automatically submit when file is selected

Icon Leave Comment
Actually I get answer when wrote post in DIC, now I wanted to post about it in my blog.
Whatever what I did is:
  • Wrote simple html
  • Added jquery
  • And finally wrote JS code which will make all work

First step: Writing simple html

Just simple html code with <input type="file" />
<html>
<head>
</head>
<body>
  <form id="form" method="POST" action="upload.php">
    <input  id="file_input" type="file" name="uploadedFile" />
  </form>
</head>
</body>
</html>


Second step: adding jquery

We will use this source as jQuery src file. Just will add this code in head
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"> </script>


Third step: adding main script

For that we will add this part of code:
<script type="text/javascript">
$(function() {
  var input = document.getElementById("file_input");
  input.addEventListener("change", submit);

  function submit() {
    document.forms["form"].submit();
  }
});
</script>


This part acutaly just adds event listener for changing of file selecting. I tried making this with only jQuery, like:
$('#file_input').change(function() { $('#form').submit(); } );


But that haven't worked, so I found this way easy. So good luck with that!
Note: I have attached file with all source code.
Attached File  index.html (511bytes)
Number of downloads: 17

0 Comments On This Entry

 

Trackbacks for this entry [ Trackback URL ]

There are no Trackbacks for this entry

September 2014

S M T W T F S
 123456
78910111213
14151617181920
21 22 2324252627
282930    

Recent Entries

Search My Blog

0 user(s) viewing

0 Guests
0 member(s)
0 anonymous member(s)