使用bootstrap模式上传图像和表单数据

Question

我正在尝试将图像上传到我的服务器并一次性将其添加到数据库中。我正在使用bootstrap，所以我不确定这是不是问题，但我的图像没有上传，也没有给我一个文件名。

    <form class="addItem" role="form" method="POST" enctype="multipart/form-data" action="add_item.php">
                                  <div class="form-group">
                                    <input type="text" name="name" class="form-control" placeholder="Item name...">
                                  </div>
                                  <div class="form-group">
                                    <input type="file" name="image" class="form-control" placeholder="Upload image...">
                                  </div>
<button type="button" class="btn btn-primary" id="addItem">Add Item</button>

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

    $("button#addItem").click(function(){
    $.ajax({
      type: "POST",
      url: "add_item.php",
      data: $('form.addItem').serialize(),
      success: function(msg){
        $("#thanks").html(msg);
        $("#itemModal").modal('hide');
      },
      error: function(){
        alert("failure");
      }
    });
  });
});
</script>

其他数据提交得很好，但不是图像。