Asked  8 Months ago    Answers:  5   Viewed   48 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).

Wednesday, March 31, 2021
answered 8 Months ago

You could make this a lot easier to maintain with a slight rework of your form field names. For example, this line in your script:

$body_message .= 'Reason for Leaving: '.$field_cur_reason_leaving."rn";

If you change this form field name to $reason_for_leaving in your HTML--and do the same for the other fields--you could process your form and generate your email message like this:

$body_message = ''; // initialize email body

foreach ( $_POST as $key => $value ) {
    if ($key == 'somethingspecial') {
        // special parsing for this field
    } else {
        // some basic sanitization
        $_POST[$key] = trim(stripcslashes(strip_tags( $value )));
        if ($_POST[$key] != '') {
            // If field isn't blank, make the form field name
            // look nice and add the value for the form field
            $body_message .= ucwords(str_ireplace( '_', ' ', $key )) .': '. $value . "rn";

Obviously, you'll need to do a little more work for special form fields (like your checkboxes), but this should greatly simplify your code (and your life).

Wednesday, March 31, 2021
answered 8 Months ago

move_uploaded_file returns true on success, the remaining elseif are never reached. Try something like this:

$error = false;

if(move_uploaded_file($_FILES['photo']['tmp_name'], $target))  
echo "The file ". basename( $_FILES['uploadedfile']['name']). " has been uploaded, and your information has been added to the directory";  
} else $error = true;

if(move_uploaded_file($_FILES['photo1']['tmp_name'], $target1))  
echo "The 2 file ". basename( $_FILES['uploadedfile']['name']). " has been uploaded, and your information has been added to the directory";  
} else $error = true; 

if(move_uploaded_file($_FILES['photo2']['tmp_name'], $target2))  
echo "The 3 file ". basename( $_FILES['uploadedfile']['name']). " has been uploaded, and your information has been added to the directory";  
} else $error = true;

   echo "Sorry, there was a problem uploading your file.";
Wednesday, March 31, 2021
answered 8 Months ago

Solved after reading this post: Uploading multiple files asynchronously by blueimp jquery-fileupload

All it was needed was to save the input field name into a 'paramNames' variable to send it alongside the 'filesList' variable.

Updated working code:

var imageUpload = {
init: function (selector, context, options) {

    selector = selector || '.file-upload';
    context = context || $('.entry_form');

    var filesList = [],
        paramNames = [];
    var url = site_url + '/doUpload';

    $(selector, context).fileupload(options || {
        url: url,
        type: 'POST',
        dataType: 'json',
        autoUpload: false,
        singleFileUploads: false,
        add: function (e, data) {
            for (var i = 0; i < data.files.length; i++) {

            return false;
        change: function (e, data) {

        done: function (e, data) {


    $('#save_btn').click(function (e) {

        $(selector, context).fileupload('send', {files:filesList, paramName: paramNames});
Wednesday, March 31, 2021
answered 8 Months ago

can you try $.post instead of $.ajax

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

// callback function..

}, 'json'}
Tuesday, August 31, 2021
Mateusz Pryczkowski
answered 2 Months ago
Only authorized users can answer the question. Please sign in first, or register a free account.
Not the answer you're looking for? Browse other questions tagged :