页面

<script type="text/javascript" src="js/jquery.form.js"></script>
<script language="javascript">
$(function() {

  //提交表单
        $("#add").click(function() {
            if($('#addForm').form('validate')){
               var options = {
                    url: '${currentBaseUrl}/doAdd',
                    type: 'post',
                    success: function (data) {
                        if("ok"==data.message)
                            window.location.href=data.backUrl;
                        else{
                            $.messager.alert('提示', data.message);
                            $("#imageFile").val("").focus()
                        }
                    }    
                };
                $('#addForm').ajaxSubmit(options);
            }         
        });
})
</script>

<form method="post" class="validForm" id="addForm" name="addForm" enctype="multipart/form-data">
    <input type="file" id="imageFile" name="imageFile"  class="txt w240 easyui-validatebox"  />
    <input type="button" id="add" class="btn" value="提交" />
</form>


Controller类

@RequestMapping(value = "doAdd", method = { RequestMethod.POST })
@ResponseBody
 public HttpJsonResult<Object> doAdd(MultipartHttpServletRequest request, HttpServletResponse response, FbNews news){
        HttpJsonResult<Object> jsonResult = new HttpJsonResult<Object>();
        try {
            MultipartFile multipartFile = request.getFile("imageFile");
            if (null != multipartFile && multipartFile.getSize() > 0) {
                //扩展名
                String extend = multipartFile.getOriginalFilename().substring(multipartFile.getOriginalFilename().lastIndexOf(".") + 1).toLowerCase();
                if (!isImg(extend)) {
                    jsonResult.setMessage("请上传图片!");
                    return jsonResult;
                }
                
                File tmpFile = new File(buildImgPath(request) + "/"+ multipartFile.getOriginalFilename());
                if (!multipartFile.isEmpty()) {
                    byte[] bytes = multipartFile.getBytes();
                    BufferedOutputStream stream = new BufferedOutputStream(new FileOutputStream(tmpFile));
                    stream.write(bytes);
                    stream.close();
                }
            }
            /**其他代码省略**/
            
            jsonResult.setMessage("ok");

   //添加成功 返回列表页面
            jsonResult.setBackUrl(DomainUrlUtil.getJM_URL_RESOURCES() + "/admin/fbfc/news");
            return jsonResult;
        } catch (Exception e) {
            throw new RuntimeException();
        }
        
    }

//是否是图片

private boolean isImg(String extend) {
        List<String> list = new ArrayList<String>();
        list.add("jpg");
        list.add("jpeg");
        list.add("bmp");
        list.add("gif");
        list.add("png");
        list.add("tif");
        return list.contains(extend);
    }

//图片上传的路径

private String buildImgPath(HttpServletRequest request) {
        String path = "upload";
        SimpleDateFormat formater = new SimpleDateFormat("yyyyMMdd");
        path += "/" + formater.format(new Date());
        path = request.getRealPath(path);
        File dir = new File(path);
        if (!dir.exists()) {
            try {
                dir.mkdirs();
            } catch (Exception e) {
                log.error("error", e);
            }
        }
        return path;
    }

表单提交时上传图片 表单ajax提交的更多相关文章

  1. Form表单利用Jquery Validate验证以及ajax提交

    #表单利用Jquery验证验证以及ajax提交 概述>详细讲解表单利用Jquery >验证验证以及ajax提交的过程,以及Validate的自定义提示语,非空判断,输入字段的远程ajax验 ...

  2. flask用宏渲染表单模板时,表单提交后,如果form.validate_on_submit()返回的是false的可能原因

    flask用宏渲染表单模板时,表单提交后,提交的内容符合DataRequired()校验, 但是form.validate_on_submit()返回的是False, 原因可能是表单模板中的<f ...

  3. form表单提交数据,页面必定会刷新,ajax提交数据不会刷新,做到悄悄提交,多选删除,ajax提交实例

    很多页面用到的模态对话框,如知明网站https://dig.chouti.com/的登录页都是模态对话框, 当点登录时,是用的ajax提交,因为输入错了信息,有返回消息,而页面没有刷新. jquery ...

  4. git提交时设置忽略部分文件提交

    git当前提交项目时总是会提交很多东西把Debug文件也提交了 在项目根目录(例如我的项目文件夹下,.sln文件的上一级目录)下建一个.gitignore文件,文件内容直接可粘贴下面的,这样 pack ...

  5. Ajax提交Form表单的一种方法

    待提交的表单 <form id="updatePublicKey" enctype="multipart/form-data"> <div c ...

  6. ajax提交表单、ajax实现文件上传

    ajax提交表单.ajax实现文件上传,有需要的朋友可以参考下. 方式一:利用from表单的targer属性 + 隐藏的iframe 达到类似效果, 支持提交含有文件和普通数据的复杂表单 方式二:使用 ...

  7. jQuery判断 form表单提交时一些文本框的判断

    一: form表单提交时如果表单里有input标签为空那么不提交form表单. <head> <script type="text/javascript"> ...

  8. form表单提交没有跨域问题,但ajax提交存在跨域问题

    浏览器的策略本质是:一个域名下面的JS,没有经过允许是不能读取另外一个域名的内容,但是浏览器不阻止你向另外一个域名发送请求. 所以form表单提交没有跨域问题,提交form表单到另外一个域名,原来页面 ...

  9. js实现表单验证 常用JS表单验证

    CSS代码 @charset "gb2312"; /* CSS Document */ body,dl,dt,dd,div,form {padding:;margin:;} #he ...

随机推荐

  1. [ Mariadb ] 记录一次MySQL数据库时区的问题

    操作系统:Centos 7数据库:5.5.52-MariaDB 根本问题:由于系统时区不对,造成数据库的时区和数据的时间不正确. 处理办法: # 查看系统时区, [root@mongodb ~]# t ...

  2. HDU-5451

    Best Solver Time Limit: 1500/1000 MS (Java/Others)    Memory Limit: 65535/102400 K (Java/Others)Tota ...

  3. selenium java读取csv文件 (数据驱动)

    javacsv2.1 下载地址:http://sourceforge.net/projects/javacsv/files/ 该链接可以下载java读取csv文件的jar 包.下载之后解压找到对应的. ...

  4. Selenium2+python自动化25-js处理日历控件(修改readonly属性)【转载】

    前言 日历控件是web网站上经常会遇到的一个场景,有些输入框是可以直接输入日期的,有些不能,以我们经常抢票的12306网站为例,详细讲解如何解决日历控件为readonly属性的问题. 基本思路:先用j ...

  5. KVM(七)使用 libvirt 做 QEMU/KVM 快照和 Nova 实例的快照

    本文将梳理 QEMU/KVM 快照相关的知识,以及在 OpenStack Nova 中使用 libvirt 来对 QEMU/KVM 虚机做快照的过程. 1. QEMU/KVM 快照 1.1 概念 QE ...

  6. 【hdoj_1050】Moving Tables

    题目链接 http://acm.hdu.edu.cn/showproblem.php?pid=1050 题意为: 为了叙述方便,把一个房间里面的桌子移动到另一个房间称为一个移动,给出若干个要求完成的移 ...

  7. CSS基本属性—文本属性和背景属性

    一.CSS常用文本属性 [css中的颜色表示方式]   1.直接使用颜色的单词表示:red.green.blue    2.使用颜色的十六进制表示:#ff0000,#00ff00:    六位数,两两 ...

  8. 【cocos2d-js官方文档】三、Bake功能使用说明

    设计意图 在游戏开发的过程中,经常会遇到作为UI或者不怎么修改的背景的层(Layer), 这些层内容并不怎么变动. 而在游戏的渲染过程中,这些层往往又会消耗大量的渲染时间,特别是比较复杂的UI界面,比 ...

  9. 【转-记】mysql总结

    1 | 查询所有数据  select * from Info 查所有数据 select Code,Name from Info 查特定列    2 | 根据条件查  select * from Inf ...

  10. mysql 文本搜索

    全文本搜索 MySQL支持几种基本的数据库引擎,但并非所有的引擎都支持全文本搜索.两个最常使用的引擎为MyISAM和InnoDB,前者支持全文本搜索,后者就不支持. 理解全文本搜索 在前面的学习中,我 ...