How to Test If a User Has Selected a File to Upload

How to test if a user has SELECTED a file to upload?

You can check this with:

if (empty($_FILES['logo']['name'])) {
    // No file was selected for upload, your (re)action goes here
}

Or you can use a javascript construction that only enables the upload/submit button whenever the upload field has a value other then an empty string ("") to avoid submission of the form with no upload at all.

How to determine if user selected a file for file upload?

This works in IE (and FF, I believe):

if(document.getElementById("uploadBox").value != "") {
   // you have a file
}

PHP check if there is a file selected for upload

Use the $_FILES array and the UPLOAD_ERR_NO_FILE constant:

if(!isset($_FILES['file_upload']) || $_FILES['file_upload']['error'] == UPLOAD_ERR_NO_FILE) {
    echo "Error no file selected"; 
} else {
    print_r($_FILES);
}

You can also check UPLOAD_ERR_OK which indicates if the file was successfully uploaded (present and no errors).

Note: you cannot use empty() on the $_FILES['file_upoad'] array, because even if no file is uploaded, the array is still populated and the error element is set, which means empty() will return false.

How to determine if user selected a file for file upload in real time?

You can use the change event to do this. Under that event you can check the value of the file input. If it's empty, no file was chosen.

$('#uploadFile').change(function() {
    if (this.value) {
        alert('you chose a file!');
    }
})

Working example

Checking if an input file has been selected?

You can use JQuery as FullOfQuestions said, but it would be also good to verify that the file was selected before executing button code!

<input type="file" name="file" id="myFile"/>

<!--Add disabled attribute to the button so that is appears disabled at page load-->
<button id="myBtn" type="submit" disabled>Upload CV</button>

<script type="text/javascript">
        $(function () {

            //when input's value changes
            $("#myFile").change(function () {
                if($(this).val())
                {
                    $("#myBtn").prop("disabled", false);
                }
                else
                {
                    $("#myBtn").prop("disabled", true);
                }
            });

            //when button is clicked
            $("#myBtn").click(function () {
                if($("#myFile").val())
                {
                    console.log("file selected");
                }
            });
        });

</script>

How to detect if a file input is populated in Angular?

You need to check if any files have been selected. Your code is probably throwing undefined exception.

addNewProject(title: string, reference: string, date: string) 
{        
    // Check if an image file has been selected
    if(this.selectedFiles && this.selectedFiles.length > 0) {
       let file = this.selectedFiles.item(0);
       this.currentUpload = new Upload(file);
       console.log('this is the file = ', file);
       // Call method in service to include the upload file
       this.upSvc.addNewProjectWithImage(title, reference, date, this.currentUpload);
    } 
    // otherwise call the method with default image.
    else {
       console.log('no file');
       this.upSvc.addNewProjectWithOutImage(title, reference, date);
    }
}

Check the same condition in your uploadSingle method.

uploadSingle() { 
    if(this.selectedFiles && this.selectedFiles.length > 0) { 
        let file = this.selectedFiles.item(0); 
        this.currentUpload = new Upload(file); 
    } 
}

---

Related Topics