首先这是我的表单：

<form method="post" id="addproductform" enctype="multipart/form-data">
    <h1>添加商品</h1>
    商品名称:<input type="text" id="goodsname"/>
    <br/>
    商品图片:<input type="file" id="goodsphoto"/>
    <br/>
    <br/><br/>
    商品类别<br/>
    一级类别：
    <select id="catalogue_select1">
    </select>
    二级类别：
    <select id="catalogue_select2">
    </select>
    三级类别：
    <select id="catalogue_select3">
        <option>三级电器</option>
        <option>三级女装</option>
        <option>三级男装</option>
    </select>
    <br/><br/>
    ·商品规格设置<br/><br/>
    <div id="goodsItemDiv">
        <span class="attribute">内存</span>:
        <span class='unchecked' name='1' checked='false' onclick='change(this);'>4G</span>
        <span class='unchecked' name='1' checked='false' onclick='change(this);'>8G</span>
        <span class='unchecked' name='1' checked='false' onclick='change(this);'>16G</span>
        <span class='unchecked' name='1' checked='false' onclick='change(this);'>32G</span>
        <span class='unchecked' name='1' checked='false' onclick='change(this);'>64G</span>
    </div>
    <br/>
    <br/>
    <div>
        <span class="attribute">颜色</span>:
        <span class='unchecked' name='2' checked='false' onclick='change(this);'>黑色</span>
        <span class='unchecked' name='2' checked='false' onclick='change(this);'>银色</span>
        <span class='unchecked' name='2' checked='false' onclick='change(this);'>深空灰</span>
    </div>
    <br/>
    <span class="attribute">商品价格</span>:<input type="text" id="goodsprice"/><br/><br/>
    <span class="attribute">商品库存</span>:<input type="text" id="goodsstock"/>
    <div>
        <br/>
        <b>提示:</b><span id='resultSpan'></span>
        <br/>
        <input type="button" id="additem" onclick='addItem()' value="添加商品规格"/><br/>
        <input type="button" onclick='addThisProduct()' value="添加商品"/>
    </div>
</form>

主要就是里面有个文件上传：

<input type="file" id="goodsphoto"/>

现在我希望将表单中的图片以及其它文本信息都传递到后台中，但是！我的表单中的文本信息比如商品名称等等，**我并不打算直接提交至后台中，而是在JavaScript中把填写的数据处理好后再写入到FormData中，之后会通过Ajax发送FormData给Controller**，所以我并没有直接写:

form.append("product",$("#addproductform")[0]);

我是这么向FormData填充数据的：

var form = new FormData();
<!-- 这里我想获得表单中，文件上传的部分T^T我实在不知道怎么搞才这么写的 -->
form.append("productPhoto",$("#addproductform input")[1]);
<!-- productName、catalogueI、catalogueII这些都是我处理好后的数据-->
form.append("productName", productName);
form.append("catalogueI", catalogueI);
form.append("catalogueII", catalogueII);
form.append("catalogueIII", catalogueIII);

接着，我在Controller中，是这么接收的：

@ResponseBody
@RequestMapping("/addproduct")
public int addProduct(HttpServletRequest request,@RequestParam("productPhoto") MultipartFile productPhoto) throws IOException {
    String productName = request.getParameter("productName");
    String catalogueI = request.getParameter("catalogueI");
    String catalogueII = request.getParameter("catalogueII");
    String catalogueIII = request.getParameter("catalogueIII");
    String originalFilePath = productPhoto.getOriginalFilename();
    System.out.println("productName is: "+productName);
    System.out.println("catalogueI is: "+catalogueI);
    System.out.println("catalogueII is: "+catalogueII);
    System.out.println("catalogueIII is: "+catalogueIII);
    System.out.println("originalFilePath is: "+file.getOriginalFilename());
    return 1;
}

但是就报错了：
Resolved [org.springframework.web.multipart.support.MissingServletRequestPartException: Required request part 'productPhoto' is not present]

说是我的productPhoto字段不存在？为啥会这样啊？

总的来说，我的问题就是：

请问各位大神们，我到底应该怎么写呢？主要就是我并不是把表单的所有填写的数据都直接提交的，而是经过JavaScript处理后，连并表单中的图片一起提交，此时我的前端、后端该怎么写？我写的都有哪里的错误呢？

真心请求帮助/(ㄒoㄒ)/~~而且真的很抱歉，我的C币没了，我问题太多了