Java web项目01 停车管理项目用户界面上传图片(二)

最新推荐文章于 2019-08-27 21:12:31 发布
最新推荐文章于 2019-08-27 21:12:31 发布
阅读量2.2k 收藏 19
点赞数 3
分类专栏： Java Web 文章标签： java 图片 界面 java web 管理
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_36279318/article/details/78772788
版权

(一)用户界面实现图片上传
1.1添加图片信息

 <%@include file="/common/sub_header.jsp"%>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <base href="<%=basePath%>">

        <script language="javascript">
function up() {

    var pop = new Popup( {
        contentType : 1,
        isReloadOnClose : false,
        width : 400,
        height : 200
    });

    pop.setContent("contentUrl", "<%=path%>/upload/upload.jsp");
    pop.setContent("title", "文件上传");
    pop.build();
    pop.show();
}
</script>

    </head>

    <body>
        <jsp:include page="/top.jsp"></jsp:include>
        <div class="container clearfix">
            <jsp:include page="/left.jsp"></jsp:include>
            <!--/sidebar-->
            <div class="main-wrap">

                <div class="crumb-wrap">
                    <div class="crumb-list">
                        <i class="icon-font"></i><span>新增车辆信息</span>
                    </div>
                </div>
                <div class="result-wrap">
                    <div class="result-content">
                        <form method="post" id="myform" name="myform">
                            <table class="insert-tab" width="100%">
                                <tbody>

                                    <tr>
                                        <th>
                                    <i class="require-red"></i>车牌号：
                                        </th>
                                        <td>
                    <input class="common-text required" id="hao" name="hao"
                                                size="50" type="text">
                                        </td>
                                    </tr>

                                    <tr>
                                        <th>
        <i class="require-red"></i>车辆品牌：
                                        </th>
                                        <td>
                                        <input class="common-text required" id="leixing"
                                                name="leixing" size="50" type="text">
                                        </td>
                                    </tr>

                                    <tr>
                                        <th>
                                            <i class="require-red"></i>照片：
                                        </th>
                                        <td>
                                            <input type="text" name="fujian" id="fujian" size="30"
                                                readonly="readonly" />
                    <input type="button" value="上传" onclick="up()" />
                                            <input type="hidden" name="fujian" id="fujian" />
                                        </td>
                                    </tr>

                                    <tr>
                                        <th>
                                            <i class="require-red"></i>备注：
                                        </th>
                                        <td>
                                            <input class="common-text required" id="info" name="info"
                                                size="50" type="text">
                                        </td>
                                    </tr>


                                    <tr>
                                        <th></th>
                                        <td>
                                            <input class="btn btn-primary btn6 mr10" onclick="save();"
                                                value="提交" type="button">
                                            <input class="btn btn6" onclick="history.go(-1)" value="返回"
                                                type="button">
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </form>
                    </div>
                </div>

            </div>
            <!--/main-->
        </div>
    </body>
</html>
<script>

function save() {
    if ($("#hao").val() == "") {
        $.messager.alert('警告', '车牌号不能为空！', 'warning');
        return;
    }
    if ($("#pwd").val() == "") {
        $.messager.alert('警告', '密码不能为空！', 'warning');
        return;
    }
    document.forms[0].action = "<%=path%>/AddCheAction";
    document.forms[0].submit();

}
</script>

效果演示：
这里写图片描述

(二)文件上传界面

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">    
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <link rel="stylesheet" type="text/css" href="<%=path %>/css/base.css" />
    <script language="javascript">
        function check()
        {
            if(document.formAdd.fujian.value=="")
            {
                alert("请选择文件");
                return false;
            }
            return true;
        }
    </script>
  </head>

  <body>
       <--交个文件上传处理页面upload_re.jsp -->
       <form action="<%=path %>/upload/upload_re.jsp" name="formAdd" method="post"  enctype="multipart/form-data">
           <input type="file" name="fujian" id="fujian" onKeyDown="javascript:alert('此信息不能手动输入');return false;" />
           <input type="submit" value="提交" onclick="return check()"/>
       </form>
  </body>
</html>

(三)文件上传处理upload_re.jsp页面

<%@ page contentType="text/html;charset=utf-8" language="java" import="com.jspsmart.upload.*"%>

<%@ page import="java.util.*"%>
<%
String path = request.getContextPath();
%>
<%

    String newFile1Name=null;
    String file_name=null;

    SmartUpload mySmartUpload = new SmartUpload();

    //初始化上传
    mySmartUpload.initialize(pageContext);

    //只允许上载此类文件
    try 
    {
        //mySmartUpload.setAllowedFilesList("jpg,Jpg,JPG,GIF,gif,Gif,png");
        mySmartUpload.upload();
    } 
    catch (Exception e)
    {
        //out.println("<script language=javascript>alert('上传格式错误！');   history.back(-1);</script>");
        //return;
    }

    try 
    {
           com.jspsmart.upload.File myFile = mySmartUpload.getFiles().getFile(0);
           if (myFile.isMissing())
           {
              out.println("<script language=javascript>alert('必须选择图片！');   history.back(-1);</script>");
              return;

           } 
           else 
           {
               int file_size = myFile.getSize(); //取得文件的大小 (单位是b) 
               file_name=myFile.getFileName();
               System.out.println("文件大小："+file_size+"文件名称："+file_name);
               //if (file_size > 10*1024*1024)
               //{
                  //out.println("<script language=javascript>alert('上传图片大小应控制在10K~1M之间！');   history.back(-1);</script>");
                  //return;
               //}
               //else
               //{
                   newFile1Name=new Date().getTime()+file_name.substring(file_name.indexOf("."));
                   System.out.println("新文件名称："+newFile1Name);

                   String saveurl = request.getSession().getServletContext().getRealPath("upload");

                   saveurl = saveurl+"/"+newFile1Name;
                   myFile.saveAs(saveurl, mySmartUpload.SAVE_PHYSICAL);

              // }
            } 
      } 
      catch (Exception e)
      {
        e.toString();
      }
%>

<script language="javascript">
    document.write("上传成功");
    window.parent.document.getElementById("fujian").value="/upload/<%= newFile1Name%>";
    window.parent.document.getElementById("fujianYuanshiming").value="<%= file_name%>";
</script>

(四)将消息添加到数据库

package com.wang.action;    

import java.io.IOException; 
import java.io.PrintWriter; 
import java.sql.*;  

import javax.servlet.ServletException;  
import javax.servlet.http.HttpServlet;  
import javax.servlet.http.HttpServletRequest;   
import javax.servlet.http.HttpServletResponse;  

import com.wang.db.DBManager;   

/**
 * 添加汽车
 */
public class AddCheAction extends HttpServlet { 

    private static final long serialVersionUID = 1L;

    public void doPost(HttpServletRequest request, HttpServletResponse response)    
            throws ServletException, IOException {  

        response.setContentType("text/html");   
        PrintWriter out = response.getWriter(); 
        String hao=request.getParameter("hao");
        String leixing=request.getParameter("leixing");
        //1.fujian附件
        String pic=request.getParameter("fujian");
        String info=request.getParameter("info");
        int uid=Integer.parseInt((String)request.getSession().getAttribute("uid"));

        DBManager dbm = new DBManager();    

        //1.添加车辆
        String sql = "insert into che(hao,leixing,pic,info,uid) values('"+hao+"','"+leixing+"','"+pic+"','"+info+"',"+uid+")";  

        Statement stat = null;  
        Connection conn=null;   
        try {   
            conn=dbm.getConnection();   
            stat = conn.createStatement();  
            System.out.println(sql);    
            stat.execute(sql);  
        } catch (SQLException e) {  

            e.printStackTrace();    
        } finally { 
            try {   
                if(stat!=null)  
                    stat.close();   
                if(conn!=null)  
                    conn.close();   
            } catch (SQLException e) {  

                e.printStackTrace();    
            }   
        }   
        response.sendRedirect("che/list.jsp");  
        out.flush();    
        out.close();    
    }   

}

(五)list.jsp将添加的车辆信息显示处理

<%@include file="/common/sub_header.jsp"%>
<%@ page language="java" import="java.util.*,java.sql.*,com.biyeseng.db.*"
    pageEncoding="UTF-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <base href="<%=basePath%>">

        <link rel="stylesheet" type="text/css" href="css/common.css" />
        <link rel="stylesheet" type="text/css" href="css/main.css" />
        <script type="text/javascript" src="js/libs/modernizr.min.js">
</script>
    </head>
    <body>
        <jsp:include page="/top.jsp"></jsp:include>
        <jsp:include page="/left.jsp"></jsp:include>
        <!--/sidebar-->
        <div class="main-wrap">

            <div class="crumb-wrap">
                <div class="crumb-list">
                    <span class="crumb-name">车辆信息</span>
                </div>
            </div>
            <div class="search-wrap">
                <div class="search-content">
                    <form action="<%=path%>/che/list.jsp" method="post">
                        <table class="search-tab">

                        </table>
                    </form>
                </div>
            </div>
            <div class="result-wrap">
                <form name="myform" id="myform" method="post">
                    <div class="result-title">
                        <div class="result-list" id="result-list">
                            <a href="<%=path%>/che/addChe.jsp"><i class="icon-font"></i>添加车辆信息</a>

                        </div>
                    </div>
                    <div class="result-content">
                        <table class="result-tab" width="100%">
                            <tr>


                                <th>
                                    ID
                                </th>
                                <th>
                                    车牌号
                                </th>

                                <th>
                                    车辆品牌
                                </th>

                                <th>
                                    照片
                                </th>

                                <th>
                                    备注
                                </th>

                                <th>
                                    操作
                                </th>
                            </tr>
                            <%
                                DBManager dbm = new DBManager();
                                Connection conn = dbm.getConnection();
                                String sql = "select * from che ";

                                PreparedStatement pstmt = conn.prepareStatement(sql);
                                ResultSet rs = pstmt.executeQuery();

                                while (rs.next()) {
                                    String id = rs.getString("id");
                            %>
                            <tr>


                                <td>
                                    <%=id%>
                <script type="text/javascript">
                                       document.getElementById("result-list").style.display="none";
                                    </script>
                                </td>
                                <td title="">
                                    <%=rs.getString("hao")%>
                                </td>

                                <td title="">
                                    <%=rs.getString("leixing")%>
                                </td>

                                <td title="">
                                    <!--获取数据库中的图片名称  -->
<img src="<%=path%>/<%=rs.getString("pic")%>" height="100px" width="200px"/>
                                </td>

                                <td title="">
                                    <%=rs.getString("info")%>
                                </td>

                                <td>
                                    <a class="link-update"
        href="<%=path%>/che/modChe.jsp?id=<%=id%>">修改</a>
        <a class="link-del" href="<%=path%>/DelCheAction?id=<%=id%>">删除</a>
                                </td>
                            </tr>
                            <%
                                }
                                if (rs != null)
                                    rs.close();
                                if (pstmt != null)
                                    pstmt.close();
                                if (conn != null)
                                    conn.close();
                            %>
                        </table>
                        <div class="list-page">

                        </div>
                    </div>
                </form>
            </div>
        </div>
        <!--/main-->

    </body>
</html>

效果演示：
这里写图片描述

凯耐
关注
专栏目录
MySQL三大日志详解
Hi，我是sharkchili，CSDN Java领域博客专家，开源项目JavaGuide维护人员，我想写一些有意思的东西，希望对你有帮助。
09-03 668
这个是InnoDB存储引擎独有的日志，用于MySQL工作过程中宕机时进行数据恢复的文件，从而保证数据的持久性以及完整性。我们都知道MySQL是需要保证原子性的，这就需要在数据持久化操作之前会这些数据进行记录的，undo log做的就是这些事，当SQL操作发生异常等情况时，我们就可以通过undo log将事务回滚确保事务的原子性。而mvccMySQL事务与并发控制详解。
添加删除记录及简单验证
rabbit_shuang的专栏
08-26 435
最近做页面动态添加数据，根据网友发布的经验整合一下，可实现基本功能。晒一晒，分享一下。本人初学编程，代码难免冗余复杂，多多包含。//js部分function checkAdd(){//验证不为空if(document.formAdd.txtCountry.length!=null){for(i= 0;i if(document.formAdd.txtCountry[i].value==
Struts2(八.添加用户多张照片实现文件上传功能)
weixin_30421809的博客
07-24 261
1.modify.jsp 在modify.jsp修改用户信息页面实现文件上传，添加用户照片的功能 如果是文件上传，method必须是post，必须指定enctype <form method="post" enctype="multipart/form-data"> 代码： 上传照片 <br> <br> <!-- 照片上传，可以上传多个...
document.forms的用法(详解)
热门推荐
念念不忘，必有回响
03-22 3万+
代码 作用 document.forms 表示获取当前页面的所有表单 document.forms[0] 表示获取当前页面的第一个表单 document.forms[‘exportServlet’] 表示获取当前页面的name="exportServlet"的表单 document.forms[‘exportServlet’].username.value 获取表单为e...
javaWeb之文件上传与下载基础学习与总结（功能已实现）
林大侠
08-27 639
1.文件上传 1.1.表单    表单的method属性必须为post；    表单的enctype（底层的编码格式）属性必须为multipart/form-data；    上传文件的控件是input，type属性为file。 1.2.导包    commons-fileupload是Apache开发的一款专门用来处理上传的工具，它的作用就是可以从request对象中解析出，用户发送的请求参数...
Android项目源码完整的Ftp的上传下载项目
07-29
一个基于androidFtp的上传下载完整版代码，链接字符串都是在源码里写死的，可以自己改。看了一下上传下载功能代码里都有实现。手头没有现成的ftp就没有测试，需要的可以自己测试一下。安卓ftp类的源码不多，例子大全里还有两个http://www./demo/mulu 需要的自己下载研究。
Java web项目01 停车管理系统登录界面(一)
凯耐的博客
12-11 1万+
(一)界面源码<%@include file="/common/sub_header.jsp"%> <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head>
ParkinglotWebService:智能自助式停车场管理系统 后台web管理服务器 java web项目
05-18
#智能自助式停车场管理系统——后台web管理服务器的设计 设计的意义 方便管理员管理整个系统，了解停车场的状态，实时管理停车场。并对用户实时动态管理。有了这个系统，停车场不需要人员值守。 功能 监控管理 视频...
基于java的Web停车场管理系统的设计与实现
12-30
《基于Java的Web停车场管理系统的设计与实现》 在当今信息化社会，智能化的停车场管理系统已经成为城市交通管理不可或缺的一部分。本文将详细解析一个基于Java技术构建的Web停车场管理系统的设计思路、实现方法以及...
智能自助式停车场管理系统 后台web管理服务器 java web项目.zip
最新发布
01-14
智能自助式停车场管理系统是基于Java Web技术开发的一种高效、便捷的后台管理平台，它涵盖了停车场运营的各个环节，包括车辆进出管理、车位状态监控、费用计算、用户服务等多个功能模块。这个项目不仅展示了Java在...
课程设计-基于Java web的停车场管理系统（源码+数据库）.zip
10-13
【标题】中的“基于Java Web的停车场管理系统”指的是一个使用Java技术栈开发的Web应用程序，其目的是管理和优化停车场的运营。这种系统通常包括用户界面、后台处理、数据库交互等核心功能，以实现对停车位的预订、...
弹出可移动的层,有多种弹出方式
12-19
弹出可移动的层,有多种弹出方式 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <script language='javascript' src='pop.js'></script> <TITLE> JS弹出浮动层窗口_演示_www.codefans.net </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> </HEAD> <BODY> <Script Language="JavaScript"> function ShowIframe() //显示iframe { var pop=new Popup({ contentType:1,isReloadOnClose:false,width:400,height:500}); pop.setContent("contentUrl","http://www.codefans.net"); pop.setContent("title","框架iframe示例"); pop.build(); pop.show(); } function ShowHtmlString() //显示html { var strHtml = "<table border=1 style='width:90%; text-align:center;'><tr style='height:40px'><td>ds</td><td>dads</td></tr><tr style='height:40px'><td>dadas</td><td>dasd</td></tr><tr style='height:40px'><td>dadasd</td><td>dsadads</td></tr></table>"; var pop=new Popup({ contentType:2,isReloadOnClose:false,width:340,height:300}); pop.setContent("contentHtml",strHtml); pop.setContent("title","字符串示例html"); pop.build(); pop.show(); } function ShowAlert() //显示警示对话框 { var pop=new Popup({ contentType:4,isReloadOnClose:true,width:340,height:80}); pop.setContent("title","源码爱好者警告框示例"); pop.setContent("alertCon","您好！欢迎来到源码爱好者！"); pop.build(); pop.show(); } function ShowConfirm() //显示确认对话框 { var pop=new Popup({ contentType:3,isReloadOnClose:false,width:340,height:80}); pop.setContent("title","对话框示例confirm"); pop.setContent("confirmCon","您好！您要关闭源码爱好者吗？？"); pop.setContent("callBack",ShowCallBack); pop.setContent("parameter",{id:"divCall",str:"点击确定后显示的字符串",obj:pop}); pop.build(); pop.show(); } function ShowCallBack(para) //回调函数 { var o_pop = para["obj"] var obj = document.getElementById(para["id"]); o_pop.close(); obj.innerText = para["str"]; } </Script> <INPUT TYPE="button" value="ShowHtmlString()" onclick="ShowHtmlString();"> <br> <INPUT TYPE="button" value="ShowIframe()" onclick="ShowIframe();"> <br> <INPUT TYPE="button" value="ShowAlert()" onclick="ShowAlert();"> <br> <INPUT TYPE="button" value="ShowConfirm()" onclick="ShowConfirm();"> </BODY> </HTML>
document.form1(<form name="form1">).（可以根据id=“” 和name=" "）.value得到值
a464064368的博客
03-14 2519
DOCTYPE html> html> head>     meta charset="UTF-8">     meta http-equiv="X-UA-Compatible" content="IE=edge">     meta name="viewport" content="width=device-width, initial-scale=1"> head> bo
upload()方法
每天进步一点点
07-29 4746
private void upLoad() { // Bitmap bitmap; // Bitmap bmpCompressed; // for (int i = 0; i < list.size() - 1; i++) { // bitmap = BitmapFactory.decodeFile(list.get(i)); //
jsp页面通过uploadfile工具上传文件
zl386119974的专栏
08-10 724
DiskFileItemFactory factory = new DiskFileItemFactory(); factory.setSizeThreshold(1024*1024*20); factory.setRepository(new File(request.getRealPath("/")+"\\uploadfile\\")); ServletFileUpload upload
django文件——django + jquery-file-upload上传篇（二）-- 插件实现文件上传+进度条显示 +拖入文件上传...
weixin_34072857的博客
05-08 1130
django + jquery-file-upload 插件实现文件上传+进度条显示 1.model.py class Fujian(models.Model): name = models.CharField(max_length=32,verbose_name="附件名称") file = models.FileField(upload_to="upload/%Y/...
解决 jQuery 实现填充父窗口iframe里元素的值的问题 如window.parent.document.getElementById().innerHTML...
weixin_33810302的博客
10-13 439
解决 jQuery 实现父窗口的问题 如window.parent.document.getElementById().innerHTML 2009年12月22日 星期二 11:29 A.M. 因为先前遇到的问题，所以我考虑采用 IFRAME 来隔离不同的脚本，从而实现我需要的效果。 在框架中，我用 JavaScript 获取 JSON 数据，组织成 HTML 代码，最后将其填充至上...
Java Web停车场管理系统项目源码与数据库解析
资源摘要信息:"本资源是一个关于基于Java Web技术的停车场管理系统的大作业项目。这个项目获得了98分的高分评价，是一个成熟且高质量的学习资源，特别适合计算机专业的学生作为期末大作业或课程设计的参考。系统包含...
评论 14
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值