handler doesn't see my file I want to upload

Question

I POST the form with help of the posting function in jQuery, in my handler I want to get the file that I tried to upload but it says all the time it have no index! :(

And its not that I get nothing because I get the 2 other fields I have in my form.

In the form I have 3 fields;
1. Title - text
2. Content - text
3. Thumbnail - file-upload

The form:

<form class="form-horizontal" method="post" id="project_edit_form" enctype="multipart/form-data">
  <div class="form-group">
    <label for="title" class="control-label">Titel</label>
    <input type="text" name="title" class="form-control" id="title" <?=(empty($data['title'])) ? 'placeholder="Titel"' : 'value="'.$data['title'].'"'?>>
  </div>
  <div class="form-group">
    <label for="content" class="control-label">Beschrijving</label>
    <textarea style="max-width:100%;" name="content" class="form-control" id="content" <?=(empty($data['content'])) ? 'placeholder="Beschrijving"' : ''?>><?=(empty($data['content'])) ? '' : $data['content']?></textarea>
  </div>
  <div class="form-group">
    <label for="picture" class="control-label">Thumbnail</label>
    <input type="file" name="picture" class="form-control" id="picture">
    <img class="form-control" style="max-width:35%; height:auto;" src="images/projects/<?=(empty($data['picture'])) ? 'default.png' : $data['picture']?>">
    <input type="submit" id="save_project" value="Opslaan" class="btn btn-lg btn-primary" style="float:right;">
  </div>
</form>

jQuery:

$("#project_edit_form").on("submit", function(e) {
    e.preventDefault();
    var form = $(this);
    var url = "project_edit_handler.php";
    var posting = $.post(url, form.serialize());
    posting.done(function(data){
        alert(data);
    });
});

Handler:

<?php
echo $_POST['title']; //Work
echo $_POST['content']; //Work
echo $_POST['picture']; //Dont work
?>