如何使用ajax,jquery和spring mvc上传文件和数据

时间:2016-07-23 12:01:03

标签: javascript jquery ajax spring spring-mvc

我想使用ajax,查询和Spring MVC将数据与文件一起上传下面是我的模态弹出窗口。请有人帮我解决这个问题。

     <!-- Modal --> <div id="fileUpload" class="modal fade" role="dialog">   <div class="modal-dialog">

     <!-- Modal content-->
     <div class="modal-content">
       <div class="modal-header">
         <button type="button" class="close" data-dismiss="modal">&times;</button>
         <h4 class="modal-title" id="changeTitle"><spring:message code="ulearn.summary.mastercourse.addreference"/></h4>
       </div>
       <div class="modal-body">     <form class="form-horizontal" role="form" id="masterCourseItemForm" onsubmit="return false;">
     <div class="form-group">
         <label class="control-label col-sm-2" for="name"><spring:message code="ulearn.summary.name.label"/></label>
        <div class="col-sm-10">
                 <input type="text" class="form-control" id="name" placeholder="" value="" autofocus="true">
        </div>
     </div>
     <div class="form-group">
        <label class="control-label col-sm-2" for="pwd"><spring:message code="ulearn.summary.description.label"/></label>
        <div class="col-sm-10">
                 <textarea type="text" class="form-control" id="description" placeholder="" value=""></textarea>
        </div>
     </div>    <div class="form-group">    <label class="control-label col-sm-2" for="pwd">File Type</label>
        <div class="col-sm-10">             <select name="Select" class="selectpicker form-control" id="stateLst">
                <option value="">Select</option>
                        <c:forEach items="${fileList}" var="option">
                        <option value="${option}">
                            <c:out value="${option}"></c:out>
                        </option>
                    </c:forEach>            </select>       </div>    </div>
      <div class="form-group">
            <label class="control-label col-sm-2" for="pwd">Upload</label>
                <div class="col-sm-10">
                    <div class="fileinput fileinput-new" data-provides="fileinput">
                    <span class="btn btn-default btn-file" style="width: 468px;"><span>Choose file</span><input type="file" multiple/></span>
                    </div>
                </div>  </div>
        <div class="form-group">
       <div class="col-sm-offset-2 col-sm-10">
  <button type="button" class="btn btn-primary" id="submit" data-       backdrop="static">
 <spring:messagecode="ulearn.btn.upload.label"/></button>
 <button type="button" class="btn btn-primary" data-dismiss="modal">              <spring:messagecode="ulearn.btn.cancel.label"/></button>
          </div>
       </div>    
      </div>  
   </form>
    </div>
     </div>
    </div> 
     </div>

1 个答案:

答案 0 :(得分:0)

您可能想看一下multipart / form-data帖子。 以下是有关该主题的一些其他信息:

http://hmkcode.com/spring-mvc-upload-file-ajax-jquery-formdata/

Upload file + Form Data + Spring MVC + JQuery