Viewed   175 times

Okay so here's the scenario:

User is presented with form that contains file inputs. User submits form. Form does not pass validation/verification for one reason or another. User is presented form with errors highlighted. File inputs are now blank.


Is it possible to re-populate the file inputs with the paths to the files the user originally selected. A PHP solution would be ideal, but I'm also open to JavaScript solutions as well.



I think the short answer here is no. You can't repopulate file upload fields. However, you can work around it.

If a file has been selected and the form submitted, then you've already received the file. What you can do is keep a reference to the file on disk and put that in a hidden field and show a message to indicate to the user you still have their file uploaded so it does not need to be replaced/re-uploaded. When your form gets submitted again without a file, you can check for the hidden field value and use that to get your local copy of the file they uploaded in their last attempt.

The other way to do this is to either submit the form via ajax (using either flash or the iframe method for the file upload) or to do an ajax call to validate the form first, and then only submit as normal if valid (thus no form reload, no loss of file upload field data).

Monday, August 15, 2022

Check out this answer for making file uploads with AJAX. It is possible, but not compatible in all browsers.

jQuery Upload Progress and AJAX file upload


Alternatively, if you want on the fly uploads, there is a cool library you can get called 'Uploadify'. It's a flash/jquery (or HTML5 now) rig that allows you to upload files on the fly. In the flash version, last time I used it... you can add in callback functions to make it do essentially anything you want.

Some clever javascript could make this work for you.

Thursday, August 4, 2022

Here is a example of what Michael is talking about.

Saturday, October 29, 2022

can you try $.post instead of $.ajax

$.post(url, {argument_name: value, ...} , function(data){

// callback function..

}, 'json'}
Monday, September 12, 2022

My advise would be to use the jQuery.form plugin, which turns your form into a Ajax form with very little work and code. It would make your code so much simpeler.

Download the .js file from jQuery Form Plugin, and just add this line to your code:

<script src="jquery.form.3.10.js"></script>

Remove everything except your form (but add an 'id' and an 'action' argument to it), and then add:

<script type="text/javascript">
    $(document).ready(function() {
                beforeSubmit: checkForm, 
                type: 'post', 
            dataType:  'json', 
                cache: false,
                beforeSend: function() {
                    $("#formstatus").addClass( "ui-autocomplete-loading" );
                success: function(data, status, xhr, myForm) {
                    if ( data.usersfound !== undefined ) {
                        $('#output').html( 'ok' );
                        // ### todo: do something with data
                    if ( data.erroruser !== undefined ) {
                        $('#output').html( 'error: ' + data.erroruser.msg );
                        // ### your code returned an error
                error: function(xhr ,status ,error ) {
                    $('#output').html( xhr.responseText ); 
                    // ### status != 200
                complete: function() {

    function checkForm() {
        // ### todo: check the input of the form; return(false) if something is wrong, else return(true)

- ui-autocomplete-loading is a class from jQuery UI which shows a 'doing-some-loading' animation. This is off course optional
- the result of saving your data should return json data. This could be (usersfound:[{"id":"1", "name":"john"}]) or (erroruser:{"msg":"bla"})

More examples can be found on the jQuery Form Plugin page!

Thursday, November 17, 2022
Only authorized users can answer the search term. Please sign in first, or register a free account.
Not the answer you're looking for? Browse other questions tagged :