jQuery/ajax/PHP image uploader size limit

Question

I have a simple jQuery/ajax/PHP image uploader:

jQuery/Java Script

$('#submit_image').on('click', function() {
    var file_data = $('#post_upload').prop('files')[0];   
    var form_data = new FormData();                  
    form_data.append('file', file_data);

$.ajax({
            url: 'upload.php', 
            dataType: 'text',
            cache: false,
            contentType: false,
            processData: false,
            data: form_data,                         
            type: 'POST',
            success: function(php_script_response){
                alert(php_script_response);
            }
 });
});

upload.php

<?php

if ( 0 < $_FILES['file']['error'] ) {
    echo 'Error: ' . $_FILES['file']['error'] . '<br>';
}
else {

    echo $_FILES['file']['size'];

    move_uploaded_file($_FILES['file']['tmp_name'], 'user/upload/'. $_FILES['file']['name']);
}

?>

HTML form

<form action="" method="POST" id="post_image_form">
        <input type="file" id="post_upload" name="image" accept="image/*" />
        <input type="submit" id="submit_image" class="button" value=" share " />
</form>

I can upload images without problems as long as their file size is smaller than approx. 50kb which is too small for my purpose. What can I do to get rid of this limit?

EDIT: Since my post was downvoted because there is no reference in my code for the 50kb limit: There is no limit. I did not code anything like a file size limit but still there is one - Why?

Answer 1

You don't have a valid enctype in your form.

Uploading files requires enctype="multipart/form-data" be inside the form tags.

Modify your form so that it is like this:

<form action="" method="POST" id="post_image_form" enctype="multipart/form-data">