Jsp制作企业后台数据库管理系统

一、在任何管理网站都需要的一个是登录系统登录界面,所以先制作一个登录界面。

㈠、

命名login.jsp

 

下面是我制作此表单页面的代码

 

表单name/idLogin

登录名username,为了美观我在前面加了图片01.gif


密码框possword,为了美观我在前面加了图片02.gif

 

提交/重置按钮,可用空格来调整他的位置

我在提交/重置按钮的这个单元格里面,在它们的右边添加了“用户注册”加上超链接,当点击他时跳转到“用户注册”页面

 

㈡、在这个表单页面里面我加入了一个显示动态时间的一个功能,也就是能够动态的显示时间,没分每秒都在变化的。

利用获取静态时间的方法制作动态时间效果:在之前做的项目中用到显示时间的都是一些静态的时间也就是当你进入这个网页时获取的时间,然后若想用这个静态时间的方法来实现动态时间的效果则需要将页面分为框架形式,然后将显示静态时间的js放到这个框架里面再不断的刷新这个框架才能实现动态时间的效果。

直接利用js来实现动态时间的效果:这里我用一个div来装这个js,大部分都是用div来装这个js才能有效果

 

代码:


<div id="time"><script>

document.getElementById('time').innerHTML='当前时间: '+new Date().toLocaleString()+' 星期'+'日一二三四五六'.charAt(new Date().getDay());

setInterval("document.getElementById('time').innerHTML='当前时间: '+new Date().toLocaleString()+' 星期'+'日一二三四五六'.charAt(new Date().getDay());",1000);

</script></div>

记得在页面顶部导入包


㈢、我在这个页面中加入了之前项目中的头文件,将之前的头文件head.jsp复制到项目中,然后在login.jsp头部加入 <%@include file="head.jsp" %>

 

㈣、在用户没有输入任何东西就点击登录时,我们给他一个弹出窗口进行提示,在这里需要加入一个js来实现。

 

代码:    <script language=javascript>

<!-- 

function CheckForm(){

if(document.Login.username.value==""){

alert("请输入用户名!");

document.Login.username.focus();

return false;}

if(document.Login.password.value == ""){

alert("请输入密码!");

document.Login.password.focus();

return false;}}

</script>

//alert为弹出窗口时所需要显示的提示内容


㈤、设计数据库新建qiye.mdb

1)建立data文件夹

     新建qiye.mdb

2)建立表admin,表结构如下图

输入数据

 

在后期的增删查改可用到

㈥、新版本JDK没有带jdbc-odbc链接桥,如何实现链接?

1、下载数据库链接驱动程序Access_JDBC30.jar

2、把驱动部署到WEB-INF\lib目录下。

刷新,能识别驱动。

 


 

3装载驱动程序

   Class.forName("com.hxtt.sql.access.AccessDriver");

4连接数据库

   String path="jdbc:Access:///"+getServletContext().getRealPath("/").replaceAll("\\\\", "/")+"qiye.mdb";

//数据库路径从根文件WebContent开始算

Connection con = DriverManager.getConnection(path);

 

二、在完成登录页面后需要一个检查的页面

㈠命名为chk_login.jsp

整体的代码

 

首先导入数据库的包<%@page import="java.sql.*" %>,凡是有用到数据库的页面都必须导入此包

对于数据库的操作我一起放在最下面,同时需要对数据库操作完毕后 才能对以下的页面进行连接

三、建立一个总页面session.jsp此页面为一个大框架

 

代码:

此页面又三部分组成top.jsp  zb.jsp  yb.jsp三个页面

阻止非法用户绕过登陆访问管理员页面:在用户没有登录的时候访问这个页面页面将弹出一个提示窗口然后会跳转会登录界面(要直接将session.jsp网页直接打开才看得出效果)

 

此效果要在session.jsp中加入

<%

if((String)session.getAttribute("login_name")==null){

out.println("<script LANGUAGE='javascript'>alert('请先登陆');window.location.href='login.jsp';</script>");

return;

}

%>

 

这种效果在往后的登录系统中都可以用上

2. 分页框架top.jsp

总体代码:

加上某某某欢迎登录效果

 

“企业欢迎你”字体的前面加上<%=session.getAttribute("login") %>用户,用来获取登录名

 

“企业欢迎您”字体的后面加上图片“重新登录”加上超链接让点击他时跳转到登录界面

 

然后再在总体的table后面加上非法阻止登录的代码(和上面的那句一样的)

 

3. 分页框架zb.jsp


“注册用户管理”上加上超链接点击它时跳转到regester.jsp让它在mainframe中显示,也就是在中间的框架上显示。

 

同理在“后台用户管理”上加超链接点击时跳转到user_info.jsp

 

四、在点击后台管理时跳转到用户后台管理系统用于浏览用户的信息

1. 命名为user_info.jsp

 

页面整体代码:

 


2. 做好这个表单布局后在表单中的大表格中加入连接数据库的语句

  <%

try{

Class.forName("com.hxtt.sql.access.AccessDriver");

}

catch(ClassNotFoundException e){}

try {

String path="jdbc:Access:///"+getServletContext().getRealPath("/").replaceAll("\\\\", "/")+"qiye.mdb";

    Connection con = DriverManager.getConnection(path);     

Statement sql=con.createStatement();

      ResultSet rs; //建立ResultSet(结果集)对象

      rs = sql.executeQuery("Select * from admin"); //执行SQL语句

%>   记得导入<%@page import="java.sql.*" %>

这个语句几乎是固定的,在往后的 数据库连接中也可以借鉴这个语句

3. 在表格的登录名以及权限位置的下面这个表格上(也就是j0所在的单元格里)分别

 

加入<%=rs.getString("username")%><%=rs.getString(4)%>

 

此操作就是使用上面的ResultSet对象的rs.getString()读取数据表字段的数据,读出账号和权限放到相应的单元格。

4.在这一行所在的单元的大表格代码上面加循环语句  <%

  while(rs.next()){

 

  int id=rs.getInt("id");

//在列表中列出id

 

%>

让表格可以不断的列下去

 

5.在后面就要把数据库给关闭了:

 <%

  }

  con.close();

  }

catch(SQLException e1){}

  %>

  放在最外面的表格结束标签内

 

6. 若你所做的这个user_info.jsp页面不在session页面中的中间框架中显示时可在“用户管理”后面加一个返回照片加上链接让点击它时可跳回到session页面中

 

五、注册表单页面

1. 命名为regester.jsp

页面效果:

 

整体代码:

 


表单属性<form action="add.jsp" method="post" name="Login" target="_parent" id="Login" onSubmit="return CheckForm();">

账号:username

密码:password

权限:purview,普通管理员值0,超级管理员值1

 

2. 其实也就是将登录页面login.jsp页面改了一下,加多了一个权限列表

 

 

3. 在提交按钮的右边像登录页面那样加“用户登录”字体,加上超链接,点击时可跳转到登录界面

 

 

六、

1创建一个add.jsp页面与regester.jsp对接,在注册时可把新用户添加进数据库

1.命名add.jsp

页面整体代码:

 


1.基本语句和chk_login.jsp差不多,先数据库连接 然后记得加上int purview=Integer.parseInt(request.getParameter("purview"));来获取他的“权限”

 

2. chk_login.jsp不同的是重点、难点语句:String condition="insert into admin(username,password,purview)values('"+username+"','"+password+"',"+purview+")";

这里的瑕疵在于:注册功能的实现其实就是将用户信息添加到数据表user_info,所以可以改为*/

//String condition="insert into user_info values('"+username+"','"+password+"',"+purview+")";

3. 在注册时如果所注册的用户名已经存在了则需要一个弹出窗口进行提示


点击确定按钮后重新跳转回注册页面regester.jsp页面。

代码:  

out.print("<script LANGUAGE='javascript'>alert('您输入的用户名已经存在!请重新输入!');window.location.href='regester.jsp';</script>");


4.同理,如果注册成功则跳出一个窗口提示“注册成功”并且跳转到用户后台编辑页面user_info.jsp

 

 

 

 

2把所添加的用户信息从数据库和表中删除

1.(下面的操作在user_info中进行)

修改user_info.jsp在循环语句后面添加获取记录id语句

<%

  while(rs.next()){

  int id=rs.getInt("id");

%>  (前面的user_info.jsp已经给出来了)

在表格后面加图片“删除.png”在图片上添加链接,点击时可提交到del.jsp处理,达到删除。

<a href="del.jsp?id=<%=id%>"><img src="imgbey/删除.png" width="30" height="30"></a>

 

2. 创建一个del.jsp页面


整体代码:

前面就是数据库的连接,记得导入包就行,重点在String condition="delete from admin where id="+id;语句,这里要之前的那些语句改为“delete from”删除语句。

 

然后就是重复前面页面上的提示窗口操作了(其实我觉得在这个加一个形式为“是否删除”-“确定”“返回” 然后当点击确定时再弹出“删除用户成功”的这种提示窗口,在后面我会努力改进一下)

 


3修改编辑用户信息

1.(下面的操作在user_info中进行)

修改user_info.jsp,“修改”下面的单元格种加入图片“编辑.png

 

再在图片上加上超链接,点击时提交给edit.jsp进行操作,在超链接标签中加入href="edit.jsp?id=<%=id%>"进行传递参数

 

2.创建进行编辑处理的edit.jsp页面

整体效果:

整体代码:

3. 首页对edit页面表单的布置(可将login.jsp登录界面或者regester.jsp注册页面复制归来进行改动一下就可以了)

 

表单名称为:update

<form action="Update.jsp?id=<%=rs.getInt("id")%>" method="post" name="update" target="" id="update" onsubmit="return CheckForm();">

增加确认密码:密码文本框,名称为password2

然后添加js,作用为检查确认密码是否空,检查密码和确认密码是否一致。

     <script language=javascript>

function CheckForm()

{

if(document.update.password.value=="")

{

alert("请输入密码!");

document.update.password.focus();

return false;

}

if(document.update.password2.value=="")

{

alert("请输入确认密码!");

document.update.password2.focus();

return false;

}

if(document.update.password.value !=document.update.password2.value)

{

alert("密码和确认密码不一致!");

document.update.password2.focus();

return false;}}</script>

 


4. 完成edit.jsp动态部分:取出原用户数据,获取传递过来的id,连接数据库,按id查询出该用户数据,把相应的字段在相应表单中显示:

 

这段代码最好放在表单标签的前面。

⑴取出用户账号,在单元格中显示出来,账号不可修改:

<%=rs.getString("username")%>

 

 

⑵取出用户密码给密码密码文本框设置初始值(在第一个密码框中操作):

<%=rs.getString("password")%>

 

 

⑶对管理员的身份进行判断,在权限列表中添加

<%

  String ch1,ch2;

  if(rs.getInt("purview")==1){

  ch1="selected='selected'";

  ch2=null;

  }

  else{

  ch1=null;

  ch2="selected='selected'";

  }

 %>

 

记得在下面的“普通管理员”“超级管理员”中给他们赋个值ch1ch2

 

⑷最后数据库连接关闭

<%

con.close();

}

catch(SQLException event){}

 

%>

在最后一个</table>前加

 

3更新用户信息,在修改用户信息后需要在数据库中更新

1.创建Update.jsp

 

在后面加上一个跳转页面 out.print("<script LANGUAGE='javascript'>alert('修改用户成功');window.location.href='user_info.jsp';</script>");

 

 

最后我们整个项目的进程近乎结尾了,下面就是我们数据库连接技术了

七、

以下便为数据库的连接步骤

Sqlmysql在上面的页面中连接的方式不同)

例如

途中我注释了sqlmysql连接的语句,而且记得将jar放在bin

 

八、JSP连接SQL Server

1、登录常见问题

如果连接不上数据库,请看服务器名称为是否为主机名加实例名SQLEXPRESS

 

例如,我这里就要改为B40391\SQLEXPRESS才能连上

2、验证模式

选择服务器→属性→安全性

 

服务器身份验证选择SQL ServerWindows身份验证模式

 

设置登录名和密码选择资源管理器服务器安全性登录名→sa” 

 

右键打开属性面板,设置登录密码,这里设置为123456。

 

选择状态”选项设置是否允许连接到数据库引擎设置授予登录设置 启用”。

 

3、打开SQL Server配置管理器

SQL Server网络配置 – SQLEXPRESS的协议

 

TCP/IP右键启用

 

然后右键属性IP地址为127.0.0.1启用选择是

 

IPAII设置TCP端口为1433

 

然后重启SQL Server服务器 SQL Server服务 --  SQL Server(SQLEXPRESS)右键重新启动

 

4、测试sa用户名是否成功:

 

正常登录,验证设置成功。

 

6、加载驱动。

JDBC驱动sqljdbc42.jar下载分别放到JDK安装目录的jre/lib/ext文件夹中,和Tomcat的安装目录的lib目录下

sqljdbc”sqljdbc42”粘贴到Webcontent中的WEB-INF中的lib文件夹中

 

 

chk_login.jsp

//连接mysql数据库

   /*String path="jdbc:Access:///"+getServletContext().getRealPath("/").replaceAll("\\\\", "/")+"qiye.mdb";/*获取数据库路径*/

//数据库路径从根文件WebContent开始算

      /*Connection con = DriverManager.getConnection(path);*/注释

然后在下面加一段Connection con = DriverManager.getConnection("jdbc:sqlserver://localhost;DatabaseName=qiye;user=sa;password=111111");

7、测试应用程序

JSP连接SQL Server配置已经成功了,接下来测试是否连接成功

测试代码:

<%@ page language="java" contentType="text/html; charset=UTF-8"

      pageEncoding="UTF-8"%>

<%@page import="java.sql.*" %>

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>test_sql</title>

</head>

<body>

<%

try{

    Class.forName("com.microsoft.sqlserver.jdbc.SQLServerDriver");//加载驱动

  //Connection conn= DriverManager.getConnection("jdbc:sqlserver://localhost;DatabaseName=Test;user=sa;password=123456");//数据库名test,用户名sa,密码123456

  Connection conn= DriverManager.getConnection("jdbc:sqlserver://localhost;DatabaseName=qiye;user=sa;password=123456");//数据库名qiye,用户名sa,密码123456

    String sql = "select * from admin";//查询语句

   Statement stmt=conn.createStatement();

   ResultSet rs = stmt.executeQuery(sql);

ResultSetMetaData rsMetaData = rs.getMetaData();

    int numberOfColumns = rsMetaData.getColumnCount();//获取查询结果的列数

     while(rs.next()){

     for(int i=1;i<=numberOfColumns;i++){

     out.print(rs.getString(i)+"\t");

     }

     out.print("<br>");

   }

     out.println("successful!");//连接数据库成功时输出successful!

 }catch(Exception e){

 e.printStackTrace();

 out.println("数据库驱动加载错误");

    }

%>

</body>

</html>

显示数据表的内容:

 

则表示连接数据库成功!

6. 若数据库的源添加不了

方法一:Mdf文件和ldf文件右击-属性-安全-Authenticated Users-编辑-勾选完全控制-应用

方法二:打开数据库实例的安装目录,打开DATA文件夹。(如我的实例目录地址为:D:\Microsoft SQL Server\MSSQL10.MSSQLSERVER\MSSQL\DATA 也可能当时安装时装在C盘了)
将要附加的数据库.mdf文件和.ldf文件,剪切或复制到DATA文件夹里。

 

九、JSP连接MySQL

把mysql-connector-java-5.1.45-bin.jar下载文件复制jdk的安装目录下的jre\lib\ext的文件夹下Tomcatlib目录下。

 

测试代码:

<%@ page language="java" contentType="text/html; charset=UTF-8"

      pageEncoding="UTF-8"%>

<%@page import="java.sql.*" %>

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>mysql</title>

</head>

<body>

<%

try{

     Class.forName("com.mysql.jdbc.Driver");//加载驱动

     Connection conn= DriverManager.getConnection("jdbc:mysql://localhost/world?user=root&password=123456");//数据库名world,用户名root,密码123456

     String sql = "select * from city";//查询语句

     Statement stmt=conn.createStatement();

     ResultSet rs = stmt.executeQuery(sql);

     ResultSetMetaData rsMetaData = rs.getMetaData();

    int numberOfColumns = rsMetaData.getColumnCount();//获取查询结果的列数

     while(rs.next()){

     for(int i=1;i<=numberOfColumns;i++){

     out.print(rs.getString(i)+"\t");

     }

     out.print("<br>");

     }     out.println("successful!");//连接数据库成功时输出successful!

 }catch(Exception e){

 e.printStackTrace();

    }

%>

</body>

</html>

显示successful!则表示连接数据库成功!

 

以上便是数据库连接教程,需对应其中的页面进行操作,在这个企业后台管理项目中还可以加入分页技术,浮窗效果等等的技术,有待添加。谢谢

猜你喜欢

转载自blog.csdn.net/weixin_42264823/article/details/80934217