如何使用ajax、jquery和springmvc上传文件和数据

How to Upload both file and data using ajax , jquery and spring mvc

本文关键字:文件 数据 springmvc ajax jquery 何使用      更新时间:2023-09-26

我想使用ajax、query和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>

您可能需要了解多部分/表单数据发布。以下是关于以下主题的一些附加信息:

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

上传文件+表单数据+Spring MVC+JQuery