页面

<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. 手机端 输入法出现 input框不在屏幕中间位置的问题

    /** * 修改点击input输入框时的位置 */ $('.input-footer-none').on('focus',function(){ var _this=this; setTimeout( ...

  2. 获取mac地址和IP地址方式

    第一种 public class OperateMAC{ public static string GetMacByWMI() { string MacAddr = null; //Managemen ...

  3. 工作管理 (job control)

    这个工作管理 (job control) 是用在 bash 环境下的,也就是说:『当我们登入系统取得创建的 bash shell 进程之后,在该bush下同时进行多个工作的行为管理 』. 而所有创建的 ...

  4. hdu 5176(并查集)

    The Experience of Love Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/O ...

  5. 使用ShowDoc在线管理API接口文档

    ShowDoc是什么 每当接手一个他人开发好的模块或者项目,看着那些没有写注释的代码,我们都无比抓狂.文档呢?!文档呢?!Show me the doc !! ShowDoc就是一个非常适合IT团队的 ...

  6. 跨机房openvpn互联

    实现目标:北京的client能访问上海的client (1)vpn server配置 1)基本配置 关闭selinux sed -ri '/^SELINUX=/cSELINUX=disabled' / ...

  7. 巧用nth_element求容器前n%大小的那个数

    #include <algorithm> #include <vector> #include <iostream> #include <string> ...

  8. Hystrix熔断器(六)

    一.分布式面临的问题 复杂的分布式体系结构中的应用程序有数十个依赖关系,每个依赖关系在某些时候将不可避免地失败雪崩效应多个微服务之间调用的时候,假设服务A调用微服务B和微服务C, 微服务B和微服务C又 ...

  9. 洛谷——P1152 欢乐的跳

    P1152 欢乐的跳 题目描述 一个n个元素的整数数组,如果数组两个连续元素之间差的绝对值包括了[1,n-1]之间的所有整数,则称之符合“欢乐的跳”,如数组1 4 2 3符合“欢乐的跳”,因为差的绝对 ...

  10. 7、Django实战第7天:用form实现登录

    Django提供了form对表单进行验证,比如今天要完成的限定登录的时候用户名和密码不能为空,通过这个操作,数据进入到数据库查询之前,我们就可以过滤很多错误,避免不必要的查询. 在users目录下新建 ...