页面

<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. [ Python - 13 ] 批量管理主机必备模块

    批量管理程序必备模块 optparse configparser paramiko optparse模块 简介:        optparse模块主要用来为脚本传递命令参数功能 使用步骤: 1. i ...

  2. jQuery中操作样式

    操作行间样式 // 获取div的样式 $("div").css("width"); $("div").css("color&quo ...

  3. seneca的一段代码(原创)

    var seneca=require('seneca')() seneca.add({cmd:'wordcount'},function(msg,respond){ var length=0; if( ...

  4. Vuejs1.0学习

    1.数据双向绑定 双向绑定以后,表单中数据的改变会同步改变H2中的输出 2.v-show 内容输入前: 内容输入后:隐藏提示,展示按钮 代码实现: 此处的v-show可以换成v-if,v-show是隐 ...

  5. php 单文件上传

    php 单文件上传 通过 PHP,可以把文件上传到服务器. 创建一个文件上传表单 允许用户从表单上传文件是非常有用的. 请看下面这个供上传文件的 HTML 表单: Filename: 请留意如下有关此 ...

  6. thinkphp函数学习(0)——开篇

    因为新公司都使用thinkphp,所以就想通读一遍源码,可是在读的过程中,时常半路杀出个自定义函数,然后又要跳到函数定义的地方先看具体的函数定义,感觉特别的难受,好几次都是看到runtime.php就 ...

  7. LCA【SP913】Qtree - Query on a tree II

    Description 给定一棵n个点的树,边具有边权.要求作以下操作: DIST a b 询问点a至点b路径上的边权之和 KTH a b k 询问点a至点b有向路径上的第k个点的编号 有多组测试数据 ...

  8. RabbitMQ (一) 简介和基本概念

    原文:https://blog.csdn.net/vbirdbest/article/details/78577043 一.简介 MQ全称为Message Queue, 消息队列(MQ)是一种应用程序 ...

  9. [BZOJ4367][IOI2014]Holiday(决策单调性+分治+主席树)

    4367: [IOI2014]holiday假期 Time Limit: 20 Sec  Memory Limit: 64 MBSubmit: 421  Solved: 128[Submit][Sta ...

  10. 【数位dp】hdu2089 不要62

    http://www.cnblogs.com/xiaohongmao/p/3473599.html #include<cstdio> using namespace std; int n, ...