JQuery插件ajaxfileupload上传文件无需创建form表单

Query插件ajaxfileupload上传文件无需创建form表单，这样就可以解决在form嵌套中ajax表单提交出现的问题

页面代码：（需要把ajaxfileupload.js包含进来）

<!-- 引入相关的js文件，相对路径  -->
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/ajaxfileupload.js"></script>

<!-- 执行上传文件操作的函数 -->
      <script type="text/javascript">

       function uploadFile() {

               $.ajaxFileUpload({url:path + "/compoundbatchsearch/upLoadTxtFile.do",
                                          secureuri:false,
                                          fileElementId:"batchSearchFile", //页面中File标记 id的值
                                          dataType:"XML",
                                          success:function (data, status) {
                                          uploadcallback(data);
                                          },
                                         error:function (data, status, e) {
                                         uploadcallback("occurError");
                                         }
                                });

              }

 

<div id="search_area" style="position: absolute; z-index: auto; ">
      <input id="uploadFile" accept="text/html" type="file" name="uploadFile" />
      <input type="button" id="upload" value="uploadFile()" />
 </div>

 

服务器端代码：（应用了spring2.5，需要在spring配置文件中定义multipartResolver bean）

@Controller
public class CompoundBatchSearchController {
   
    private static final Logger logger = Logger.getLogger(CompoundBatchSearchController.class);
   
    @Resource(name="compoundBatchSearchService")
    private ICompoundBatchSearchService compoundBatchSearchService;
   
    @RequestMapping
    public void upLoadTxtFile(HttpServletResponse response, HttpServletRequest request) {
        logger.info("upload txt file action...");
        // clear session before parese txt file
        if (request.getSession().getAttribute(Constants.RESULT_IDS) != null) {
            request.getSession().removeAttribute(Constants.RESULT_IDS);
        }
       
        try {
            // upload file
            MultipartHttpServletRequest mhs = (MultipartHttpServletRequest) request;
            MultipartFile mf = mhs.getFile("batchSearchFile");
            File file = FilePathHelper.uploadFile(mf, Constants.UPLOAD_TXT);
            logger.info("upload file success!");
            Map<String, List<String>> idsMap = fetchIDsFromFile(file, response);
           
            if (null == idsMap || idsMap.isEmpty()) {
                logger.error("cannot read data form file!");
                MessageUtils.outputJSONResult("empty", response);
                return;
            }
            logger.info("read upload file success!");
            List<String> casNumbers = idsMap.get("CAS");
            List<String> mdlNumbers = idsMap.get("MDL");
            if (casNumbers != null && !casNumbers.isEmpty() && mdlNumbers != null && !mdlNumbers.isEmpty()) {
                logger.error("It contains invalid data in upload file");
                MessageUtils.outputJSONResult("dataError", response);
                return;
            }
           
            if (casNumbers != null && !casNumbers.isEmpty()) {
                List<Long> ids = compoundBatchSearchService.getStructureIdsByCasNo(casNumbers);
                if (ids != null) {
                    request.getSession().setAttribute(Constants.RESULT_IDS, ids);
                }
            }
           
            if (mdlNumbers !=null && !mdlNumbers.isEmpty()) {
                List<Long> ids = compoundBatchSearchService.getStructureIdsByMdl(mdlNumbers);
                if (ids != null) {
                    request.getSession().setAttribute(Constants.RESULT_IDS, ids);
                }
            }
            MessageUtils.outputJSONResult("success", response);
           
        } catch (Exception e) {
            logger.error(e.getMessage(), e);
            MessageUtils.outputJSONResult("occurError", response);
        }
    }

 

spring中定义的upload部分：

<!-- upload file -->
<bean id="multipartResolver"         class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
        <property name="maxInMemorySize">
            <value>20480</value>
        </property>
        <property name="defaultEncoding">
            <value>UTF-8</value>
        </property>
 </bean>

评论

5 楼 liuyong_15 2012-05-09  

正在研究AjaxFileUpload 结合springMVC上传，楼主能传个Demo版不啊？？先谢谢了

4 楼 JavaLike 2012-03-13  

gjlping 写道

您好
File file = FilePathHelper.uploadFile(mf, Constants.UPLOAD_TXT);
这个FilePathHelper 是在哪里API不存在，这个对需要指定包吗

那个类是我们项目中自定义的工具类

3 楼 JavaLike 2012-03-13  

Zale_zhy 写道

利用ajaxfileupload.js能获取到上传文件的存储路径吗

不可以的在本项目中用到的是spring中对的上传功能

2 楼 Zale_zhy 2011-10-13  

利用ajaxfileupload.js能获取到上传文件的存储路径吗

1 楼 gjlping 2011-05-19  

您好
File file = FilePathHelper.uploadFile(mf, Constants.UPLOAD_TXT);
这个FilePathHelper 是在哪里API不存在，这个对需要指定包吗