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 3 of 3
  1. #1
    Regular Coder
    Join Date
    Feb 2007
    Posts
    217
    Thanks
    25
    Thanked 1 Time in 1 Post

    Jquery, Auto submitting a file after selection?

    I've changed my 'file upload' input field into a hyperlink, which looks much better.
    I also added an auto submit, so that when the file is picked it gets automaticly submitted (normally you first select the file, and then have to hit the submit button).

    Everything works perfectly, except for the auto submit, which doesn't seem to function in Internet Explorer.
    How can I make this coding work in every browser?

    Code:
     <style type="text/css">
     #file {
        display:none;
     }
     
     .new_Btn {
     color:blue;
     cursor:pointer;
     }
    </style>
    
     
     <script type="text/javascript" 
    
                         src="http://code.jquery.com/jquery-1.5.1.min.js"></script>
    <script type="text/javascript"> 
    
    
    $(function () {
    
    $('.new_Btn').bind("click" , function () {
            $('#file').click();
        });
    
    $('#file').change(function() {
      $('#target').submit();
    });
    
    $('.new_Btn').change(function() {
      $('#target').submit();
    });
    
    });  
    </script>
    
    <html>
    <body>
    
    <form id='target' action='http://www.test.com' method='post' enctype='multipart/form-data'>
    <div class='new_Btn'>Select file</div><br>
    <input type='file' name='file' id='file'><br>
    </form>
    
    </body>
    </html>
    Ps: It works fine in Firefox, Chrome etc. but not in IE 8.0 (which is used by a lot of XP users).
    Last edited by docock; 03-19-2013 at 04:42 PM.

  • #2
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    10,950
    Thanks
    0
    Thanked 236 Times in 233 Posts
    If you want, you can try this jQuery File Upload plugin.

    https://github.com/blueimp/jQuery-File-Upload

  • #3
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    10,950
    Thanks
    0
    Thanked 236 Times in 233 Posts


  •  

    Posting Permissions

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