CODEWITHSUNDEEP
phpjqueryhtmlupload
AmarokVII
AmarokVII

Reputation: 43

Disabling Submit Button when no file selected during php upload

I tried to follow this code - confused

Here is my code for my upload. I am not exactly sure where/how to include the jquery code to enable the button after file is selected. I tried just copying the example and testing that but I still couldn't get it to work.

HTML 

<div id="floatLeft">   
<label for="fileToUpload">Select CSV file to Upload:</label>
<input type="file" name="fileToUpload" id="fileToUpload">
</div>
<div id="floatRight">
<input type="submit" value="Generate" name="submit" disabled />

</div>

JQUERY 

$(document).ready(
function(){
    $('input:file').change(
        function(){
            if ($(this).val()) {
                $('input:submit').attr('disabled',false);
                // or, as has been pointed out elsewhere:
                // $('input:submit').removeAttr('disabled'); 
            } 
        }
        );
});

Upvotes: 2

Views: 1751

Answers (2)

Augusto
Augusto

Reputation: 2222

Previous answers look goop for smaller file uploads, since .change will be fired without waiting the end of upload.

For asynchronous uploads, https://api.jquery.com/ajaxcomplete/ is very useful.

This piece of code from the Drupal world do the job:

jQuery(document).ajaxComplete(function(event, xhr, settings) {
if(typeof settings.extraData != 'undefined' && typeof settings.extraData.view_display_id != 'undefined') {

    switch(settings.extraData.view_display_id){

        case "your_view_id":

            console.log('your_view_id ajax results!');

            break;

        default:

            console.log('some other ajax result...');

            break;

    }
}

});

Upvotes: 0

IWillScoop
IWillScoop

Reputation: 258

Your code seems to work. Make sure that you have :

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>

within your head tags and that your JQuery is within script tags.

Upvotes: 1

Related Questions