zoukankan      html  css  js  c++  java
  • ssm框架下上传图片及其他信息

    先引入这两个包:

                    <dependency>
    	        <groupId>commons-fileupload</groupId>
    			<artifactId>commons-fileupload</artifactId>
    			<version>1.3.1</version>
    		</dependency>
    		<dependency>
    			<groupId>commons-io</groupId>
    			<artifactId>commons-io</artifactId>
    			<version>1.3.1</version>
    		</dependency>
    

    html:

    注意:enctype="multipart/form-data"  这个要这样定义

    <form id="form-register" action="${pageContext.request.contextPath}/user/upLoadPicture.do" method="post"  enctype="multipart/form-data" onsubmit="return check()" class="form-horizontal m-t">
    <div class="form-group">
            <label class="col-sm-5 control-label">上传头像:</label>     
            <input type="file" name="file" id="file" style="height:30px;background-color:#ff9900;outline:none;border:none;10%;" onchange="uploadPic()"> 
    
    </div>
    <div class="form-group">
      <label class="col-sm-5 control-label">头像显示:</label>
       <div class="col-sm-4" >
          <img border="0" width="40" height="50" src="${user.picture}">
       </div>
    </div>
      <input type="hidden" name="id" id="id" readonly="readonly" value="${user.id}" /> 
      <div class="form-group">
            <label class="col-sm-5 control-label"><span style="color: red;">*</span>用户名:</label>
            <div class="col-sm-4" >
                <input type="text" id="name" name="name"  class="form-control" placeholder="请输入用户名" onblur="checkName()"  maxlength="16"  value="${user.name}">
                <div id="user_prompt">用户名由4到16位(字母,数字,下划线,减号)</div>
            </div>
       </div> 
      <div class="form-group">
            <label class="col-sm-5 control-label">真实姓名:</label>
            <div class="col-sm-4">
                <input type="text" id="realName" name="realName" class="form-control" placeholder="请输入真实姓名"  value="${user.realName}">
            </div>
        </div> 
     
            	<div class="form-group">
                	<label class="col-sm-5 control-label">性别</label>
                    <div class="col-sm-4">
                    <c:if test="${user.gender=='男'}">
                       <div class="radio-box"  style="float:left">
    					<input name="gender" type="radio" id="male" value="男" checked>
    					<label for="sex-1">男</label>
    				</div>
    				<div class="radio-box"  style="float:left">
    					<input name="gender" type="radio" id="female" value="女">
    					<label for="sex-2">女</label>
    				</div>
                    </c:if>
                    <c:if test="${user.gender=='女'}">
                       <div class="radio-box"  style="float:left">
    					<input name="gender" type="radio" id="male" value="男">
    					<label for="sex-1">男</label>
    				</div>
    				<div class="radio-box"  style="float:left">
    					<input name="gender" type="radio" id="female" value="女" checked>
    					<label for="sex-2">女</label>
    				</div>
                    </c:if>
                    </div>
                </div> 
                <div class="form-group">
                	<label class="col-sm-5 control-label">民族</label>
                    <div class="col-sm-4">
                      <select name="ethGro" class="form-control input-sm">
                             <option selected="selected" value="${user.ethGro}">${user.ethGro}</option>
                      </select>
                    </div>
                </div>
            
    <br>
    
        <div class="form-group" align=center>
          <div class="col-sm-8 col-sm-offset-2">
            <button class="btn btn-primary" type="submit">保存</button>
            </div>
        </div>
    </form

     后台:

    @RequestMapping(value="upLoadPicture.do",method = RequestMethod.POST)  
    public String  upload(User user,HttpServletRequest request,ModelMap map) throws Exception{  
    	  System.out.println(request.getParameter("name"));  
          //保存数据库的路径  
          String sqlPath = null;   
          //定义文件保存的本地路径  
          String localPath="D:\File\";  
          //创建文件 
      	  File dir=new File(localPath);
          if(!dir.exists()){
      		dir.mkdirs();
      	  }
          //定义 文件名  
          String filename=request.getParameter("name").toString();    
          if(!user.getFile().isEmpty()){    
              //生成uuid作为文件名称    
              String uuid = UUID.randomUUID().toString().replaceAll("-","");    
              //获得文件类型(可以判断如果不是图片,禁止上传)    
              String contentType=user.getFile().getContentType();    
              //获得文件后缀名   
              String suffixName=contentType.substring(contentType.indexOf("/")+1);  
              //得到 文件名  
              filename=uuid+"."+suffixName;   
              System.out.println(filename);  
              //文件保存路径  
              user.getFile().transferTo(new File(localPath+filename)); 
              sqlPath = "/images/"+filename;  
              System.out.println(sqlPath);  
              user.setPicture(sqlPath); 
              userService.updateUser(user);
          } 
          //把图片的相对路径保存至数据库  
          userService.updateUserNoPicture(user);  
          Page page=new Page();
          page.setCurrentPage(1);
          List<User> users = userService.getAllUser(page);
          page.setRows( userService.count());
      	  map.addAttribute("page",page);
      	  map.addAttribute("users",users);
      	  return "user_list";
    }  
    
  • 相关阅读:
    〖Linux〗Kubuntu设置打开应用时就只在打开时的工作区显示
    〖Linux〗Kubuntu, the application 'Google Chrome' has requested to open the wallet 'kdewallet'解决方法
    unity, dll is not allowed to be included or could not be found
    android check box 自定义图片
    unity, ios skin crash
    unity, Collider2D.bounds的一个坑
    unity, ContentSizeFitter立即生效
    类里的通用成员函数应声明为static
    unity, Gizmos.DrawMesh一个坑
    直线切割凹多边形
  • 原文地址:https://www.cnblogs.com/xiaotian-222/p/9431280.html
Copyright © 2011-2022 走看看