Spring MVC 使用ajax进行文件上传

Maven的pom文件中导入jar

<!--使用文件上传-->
    <dependency>
      <groupId>commons-fileupload</groupId>
      <artifactId>commons-fileupload</artifactId>
      <version>1.3.2</version>
    </dependency>
    <dependency>
      <groupId>commons-io</groupId>
      <artifactId>commons-io</artifactId>
      <version>2.5</version>
    </dependency>

springmvc-servlet.xml中配置bean

<!-- 配置文件上传  MultipartResolver
	maxUploadSize:上传文件的最大大小(字节)
	defaultEncoding:上传文件的编码格式
	uploadTempDir:临时文件的文件夹,如果没有这个文件夹会自动创建-->
	<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
		<property name="maxUploadSize" value="500000000"/>
		<property name="defaultEncoding" value="UTF-8"/>
		<property name="uploadTempDir" value="/file/temp/"/>
	</bean>

表单数据

<form class="form-horizontal form-label-left" id="addInfoForm" method="post" enctype="multipart/form-data">
          <div class="item form-group">
            <label class="control-label col-md-3 col-sm-3 col-xs-12">软件名称 <span class="required">*</span>
            </label>
            <div class="col-md-6 col-sm-6 col-xs-12">
              <input id="softwareName" class="form-control col-md-7 col-xs-12"
                     data-validate-length-range="20" data-validate-words="1" name="softwareName"  required="required"
                     placeholder="请输入软件名称" type="text">
            </div>
          </div>
          <div class="item form-group">
            <label class="control-label col-md-3 col-sm-3 col-xs-12">APK名称 <span class="required">*</span>
            </label>
            <div class="col-md-6 col-sm-6 col-xs-12">
              <input id="APKName" class="form-control col-md-7 col-xs-12"
                     data-validate-length-range="20" data-validate-words="1" name="APKName"   required="required"
                     placeholder="请输入APK名称" type="text">
            </div>
          </div>

          <div class="item form-group">
            <label class="control-label col-md-3 col-sm-3 col-xs-12">支持ROM <span class="required">*</span>
            </label>
            <div class="col-md-6 col-sm-6 col-xs-12">
              <input id="supportROM" class="form-control col-md-7 col-xs-12" name="supportROM"
                     data-validate-length-range="20" data-validate-words="1"   required="required"
                     placeholder="请输入支持的ROM" type="text">
            </div>
          </div>
          <div class="item form-group">
            <label class="control-label col-md-3 col-sm-3 col-xs-12">界面语言 <span class="required">*</span>
            </label>
            <div class="col-md-6 col-sm-6 col-xs-12">
              <input id="interfaceLanguage" class="form-control col-md-7 col-xs-12"
                     data-validate-length-range="20" data-validate-words="1" name="interfaceLanguage"   required="required"
                     placeholder="请输入软件支持的界面语言" type="text">
            </div>
          </div>
          <div class="item form-group">
            <label class="control-label col-md-3 col-sm-3 col-xs-12">软件大小 <span class="required">*</span>
            </label>
            <div class="col-md-6 col-sm-6 col-xs-12">
              <input type="number" id="softwareSize" name="softwareSize"   required="required" onkeyup="value=value.replace(/[^\d]/g,'')"
                     data-validate-minmax="10,500"  placeholder="请输入软件大小,单位为Mb" class="form-control col-md-7 col-xs-12">
            </div>
          </div>

          <div class="item form-group">
            <label class="control-label col-md-3 col-sm-3 col-xs-12">下载次数 <span class="required">*</span>
            </label>
            <div class="col-md-6 col-sm-6 col-xs-12">
              <input type="number" id="downloads" name="downloads"   required="required"
                     data-validate-minmax="10,500"  placeholder="请输入下载次数" class="form-control col-md-7 col-xs-12">
            </div>
          </div>

          <div class="item form-group">
            <label class="control-label col-md-3 col-sm-3 col-xs-12">所属平台 <span class="required">*</span></label>
            <div class="col-md-6 col-sm-6 col-xs-12">
              <select name="flatformId" id="flatformId" class="form-control"   required="required"></select>
            </div>
          </div>

          <div class="item form-group">
            <label class="control-label col-md-3 col-sm-3 col-xs-12">一级分类 <span class="required">*</span></label>
            <div class="col-md-6 col-sm-6 col-xs-12">
              <select name="categoryLevel1" id="categoryLevel1" class="form-control"   required="required">
                <c:if test="${categoryLevel1List != null}">
                  <option value="">---请选择---</option>
                  <c:forEach var="appCategory" items="${categoryLevel1List}">
                    <c:if test="${appCategory.parentId==null}"><option value="${appCategory.id}">${appCategory.categoryName}</option></c:if>
                  </c:forEach>
                </c:if>
              </select>
            </div>
          </div>

          <div class="item form-group">
            <label class="control-label col-md-3 col-sm-3 col-xs-12" >二级分类 <span class="required">*</span></label>
            <div class="col-md-6 col-sm-6 col-xs-12">
              <select name="categoryLevel2" id="categoryLevel2" class="form-control"  required="required"></select>
            </div>
          </div>

          <div class="item form-group">
            <label class="control-label col-md-3 col-sm-3 col-xs-12">三级分类 <span class="required">*</span></label>
            <div class="col-md-6 col-sm-6 col-xs-12">
              <select name="categoryLevel3" id="categoryLevel3" class="form-control"  required="required"></select>
            </div>
          </div>
          <div class="item form-group">
            <label class="control-label col-md-3 col-sm-3 col-xs-12">APP状态 <span class="required">*</span>
            </label>
            <div class="col-md-6 col-sm-6 col-xs-12">
              <input type="hidden" name="status" id="status" value="1">待审核
            </div>
          </div>
          <div class="item form-group">
            <label class="control-label col-md-3 col-sm-3 col-xs-12">应用简介 <span class="required">*</span>
            </label>
            <div class="col-md-6 col-sm-6 col-xs-12">
              <textarea id="appInfo" name="appInfo"     required="required"
                        placeholder="请输入本软件的相关信息,本信息作为软件的详细信息进行软件的介绍。" class="form-control col-md-7 col-xs-12"></textarea>
            </div>
          </div>
          <div class="item form-group">
            <label class="control-label col-md-3 col-sm-3 col-xs-12">LOGO图片 <span class="required">*</span>
            </label>
            <div class="col-md-6 col-sm-6 col-xs-12">
              <input type="file" class="form-control col-md-7 col-xs-12" name="a_logoPicPath"  required="required" id="a_logoPicPath"/>
              ${fileUploadError }
            </div>
          </div>
          <div class="ln_solid"></div>
          <div class="form-group">
            <div class="col-md-6 col-md-offset-3">
              <button id="send" type="button" class="btn btn-success">保存</button>
              <button type="button" class="btn btn-primary" id="back">返回</button>
              <br/><br/>
            </div>
          </div>
        </form>

使用ajax进行文件上传

$("#send").click(function () {
//通过id序列化表单,注意:form标签一定要有enctype="multipart/form-data"这个属性
    var formData = new FormData($('#addInfoForm')[0]);
    $.ajax({
      url:"/addAppInfoList",
      data:formData,
      cache: false,
      processData: false,
      contentType: false,
      type:"post",
      dataType:"json",
      success:function(result){
        alert(result);
      }
    })

controller层

/**MultipartFile a_downloadLink用来接收文件,仔细观察我input标签的name和这里的参数名是一样的
*其他标签的name值与AppVersion appVersion类中的属性一一对应
*/
public String addVersion(AppVersion appVersion, MultipartFile a_downloadLink) throws ParseException {
    //request.getSession().getServletContext().getRealPath("/"):当前项目所在硬盘路径
    //file.getOriginalFilename():上传的文件的文件名称
    //把上传文件保存的地址
    String path = request.getSession().getServletContext().getRealPath("/")+"file\\temp\\"+a_downloadLink.getOriginalFilename();
    try{
      //保存文件
      a_downloadLink.transferTo(new File(path));
    }catch (Exception exce){
      System.out.println(exce.getMessage());
    }
    return JSON.toJSONString(appInfoService.insertVersion(appVersion));
  }
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值