Jsp技能入门指南【十三】基于 JSTL SQL 标签库实现 MySQL 数据库毗连与数据 ...

商道如狼道  论坛元老 | 5 天前 | 显示全部楼层 | 阅读模式
打印 上一主题 下一主题
楼主

主题 1928|帖子 1928|积分 5784

前言



  • 在上一篇博客中，我们介绍了 JSTL 中 SQL 标签库和自定义标签库 的基础用法。
  • 本文将团结 MySQL 数据库毗连 和 JSP 页面数据渲染，通过完备的技能方案实现「从数据库到前端页面」的数据流转。
   我的个人主页，接待来阅读我的其他文章
https://blog.csdn.net/2402_83322742?spm=1011.2415.3001.5343
我的JSP知识文章专栏
接待来阅读指出不敷
https://blog.csdn.net/2402_83322742/category_12950980.html?spm=1001.2014.3001.5482
  
一、回顾SQL标签的内容

   我的JSTL SQL标签具体讲解博客链接
Jsp技能入门指南【十一】SQL标签库
https://blog.csdn.net/2402_83322742/article/details/147838670
Jsp技能入门指南【九】具体讲解JSTL
https://blog.csdn.net/2402_83322742/article/details/147312023
  1. 什么是JSTL SQL标签？

首先，我们需要知道两个关键词：JSTL 和 SQL标签。


  • JSTL：全称是 JSP Standard Tag Library（JSP标准标签库），是官方提供的一套现成的“标签工具”，专门用来简化JSP页面的开辟。用它可以少写很多Java代码，让页面更干净、更易读。
  • SQL标签：是JSTL里专门用来操作数据库的一组标签，比如毗连数据库、实行SQL语句、处理惩罚查询结果等。
2.为什么要用SQL标签？

假设你不用标签，直接在JSP里写Java代码连数据库，会像这样（非常麻烦）：
  1. <%
  2. Class.forName("com.mysql.cj.jdbc.Driver");
  3. Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/test", "root", "123456");
  4. Statement stmt = conn.createStatement();
  5. ResultSet rs = stmt.executeQuery("SELECT * FROM users");
  6. // 然后循环取数据...
  7. rs.close(); stmt.close(); conn.close();
  8. %>
复制代码
而用 SQL标签，只需要几行标签代码就能搞定，不用写复杂的Java毗连逻辑，对新手更友好！
3.第一步：引入SQL标签库

要使用SQL标签，必须先在JSP页面顶部“告诉欣赏器”：我要用这个标签库！
添加一行代码（固定格式，记着就行）：
  1. <%@ taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql" %>
复制代码


  • prefix="sql"：给标签库起个简称，后面用标签时都以 <sql:XXX> 情势调用（比如 <sql:setDataSource>）。
  • uri：标签库的“地址”，固定值，直接复制就行
4. SQL标签的核心功能：毗连数据库

毗连数据库是操作数据的第一步，SQL标签里用 <sql:setDataSource> 标签 来设置数据库信息，就像“告诉标签库你的数据库在哪、怎么登录”。
标签常用属性：

属性名作用示例值（以MySQL为例）driver数据库驱动类（必须写对！）com.mysql.cj.jdbc.Driverurl数据库地址（格式固定）jdbc:mysql://localhost:3306/数据库名user数据库用户名rootpassword数据库密码123456 示例代码（毗连到名为“test”的数据库）：

  1. <sql:setDataSource
  2.     driver="com.mysql.cj.jdbc.Driver"
  3.     url="jdbc:mysql://localhost:3306/test"
  4.     user="root"
  5.     password="123456"
  6.     var="dbConn"  <!-- 给这个连接起个变量名，后面用 -->
  7. />
复制代码


  • 注意：需要提前把MySQL的JDBC驱动包（比如 mysql-connector-java-8.0.28.jar）放到项目的 WEB-INF/lib 目录下，否则会报错！
二、实例演示

接下来我们来实战一下




  • 标题要求创建一张HTML图片上的表，并且利用SQL标签库实现 MySQL 数据库毗连，将数据库表中的信息打印到显示器上
第一步：到场驱动包



  • 首先我们按照之前的那样到场jsp，jdbc的驱动包来构建情况

  1. <dependencies>
  2.         <dependency>
  3.             <groupId>javax.servlet</groupId>
  4.             <artifactId>javax.servlet-api</artifactId>
  5.             <version>3.1.0</version>
  6.             <scope>provided</scope>
  7.         </dependency>
  9.         <dependency>
  10.             <groupId>javax.servlet.jsp</groupId>
  11.             <artifactId>javax.servlet.jsp-api</artifactId>
  12.             <version>2.3.3</version>
  13.             <scope>provided</scope>
  14.         </dependency>
  16.         <dependency>
  17.             <groupId>mysql</groupId>
  18.             <artifactId>mysql-connector-java</artifactId>
  19.             <version>8.0.33</version>
  20.         </dependency>
  21.         <!-- jstl表达式依赖-->
  22.         <dependency>
  23.             <groupId>javax.servlet.jsp.jstl</groupId>
  24.             <artifactId>jstl-api</artifactId>
  25.             <version>1.2</version>
  26.         </dependency>
  27.         <!-- taglibs 标签库依赖-->
  28.         <dependency>
  29.             <groupId>taglibs</groupId>
  30.             <artifactId>standard</artifactId>
  31.             <version>1.1.2</version>
  32.         </dependency>
  33.     </dependencies>
复制代码

第二步：设置maven



  • 接着我们需要设置好自己的maven情况
  • maven情况必须是全英文，不然运行不了
   我的jsp情况搭建博客
JSP技能入门指南【一】利用IDEA从零开始搭建你的第一个JSP系统
https://blog.csdn.net/2402_83322742/article/details/146980845?spm=1001.2014.3001.5501
Java-servlet-Web情况搭建（下）具体讲解利用maven和tomcat搭建Java-servlet情况
https://blog.csdn.net/2402_83322742/article/details/145998804
  第三步：创建并导入web库



  • 我们新建了一个MySQLtest的模块，在里面单击右键，打开模板设置

  • 在MySQLtest里面添加web文件


  • 然后在工件里，找到web应用步伐展开型，找到我们刚刚添加的MySQLweb文件

  • 在web-INF文件里创建一个lib文件，并导入我们的库文件


第四步：导入jsp文件



  • 首先创建jsp文件

-


  • 导入我们的HTML代码

  1. <%--
  2.   Created by IntelliJ IDEA.
  3.   User: DELL
  4.   Date: 2025/5/13
  5.   Time: 20:34
  6.   To change this template use File | Settings | File Templates.
  7. --%>
  8. <%@ page contentType="text/html;charset=UTF-8" language="java" %>
  9. <!DOCTYPE html>
  10. <html lang="zh-CN">
  11. <head>
  12.   <meta charset="UTF-8">
  13.   <meta http-equiv="X-UA-Compatible" content="IE=edge">
  14.   <meta name="viewport" content="width=device-width, initial-scale=1 , user-scalable=no">
  15.   <title>pha-Admin</title>
  16.   <link rel="stylesheet" href="css/bootstrap.min.css"/>
  17.   <link rel="stylesheet" href="css/bootstrap-maizi.css"/>
  18.   <link rel="stylesheet" href="css/content-style.css"/>
  19.   <link rel="stylesheet" href="css/mricode.pagination.css"/>
  20.   <link rel="stylesheet" href="css/jquery.fancybox.css"/>
  21.   <link rel="stylesheet" href="css/sweetalert.css"/>
  22. </head>
  23. <body>
  24. <!--导航-->
  25. <nav class="navbar navbar-inverse navbar-fixed-top">
  26.   <div class="container">
  27.     <!--小屏幕导航按钮和logo-->
  28.     <div class="navbar-header">
  29.       <button class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
  30.         <span class="icon-bar"></span>
  31.         <span class="icon-bar"></span>
  32.         <span class="icon-bar"></span>
  33.       </button>
  34.       <a href="index.html" class="navbar-brand"> pha-Admin</a>
  35.     </div>
  36.     <!--小屏幕导航按钮和logo-->
  37.     <!--导航-->
  38.     <div class="navbar-collapse collapse">
  39.       <ul class="nav navbar-nav">
  40.         <li><a href="index.html"><span class="glyphicon glyphicon-home"></span>&nbsp;&nbsp;后台首页</a></li>
  41.         <li><a href="user.html"><span class="glyphicon glyphicon-user"></span>&nbsp;&nbsp;用户管理</a></li>
  42.         <li class="active"><a href="machine.html"><span class="glyphicon glyphicon-expand"></span>&nbsp;&nbsp;机器管理</a></li>
  43.         <li><a href="service.html"><span class="glyphicon glyphicon-tasks"></span>&nbsp;&nbsp;服务管理</a></li>
  44.         <li><a href="log.html"><span class="glyphicon glyphicon-list-alt"></span>&nbsp;&nbsp;日志管理</a></li>
  45.         <li><a href="wiki.html"><span class="glyphicon glyphicon-book"></span>&nbsp;&nbsp;使用文档</a></li>
  46.       </ul>
  47.       <ul class="nav navbar-nav navbar-right">
  48.         <li class="dropdown">
  49.           <a id="dLabel" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
  50.             admin
  51.             <span class="caret"></span>
  52.           </a>
  53.           <ul class="dropdown-menu" aria-labelledby="dLabel">
  54.             <li><a href="index.html"><span class="glyphicon glyphicon-cog"></span>&nbsp;&nbsp;个人设置</a></li>
  55.           </ul>
  56.         </li>
  57.         <li><a href="#bbs"><span class="glyphicon glyphicon-off"></span>&nbsp;&nbsp;退出</a></li>
  58.       </ul>
  59.     </div>
  60.     <!--导航-->
  61.   </div>
  62. </nav>
  63. <!--导航-->
  64. <div class="container">
  65.   <div class="row">
  66.     <div class="col-md-12">
  67.       <div class="panel-body" style="padding: 15px 0;">
  68.         <ul class="nav nav-tabs">
  69.           <li class="active"><a href="#list" aria-controls="machine" role="tab" data-toggle="tab">机器列表</a></li>
  70.           <li><a href="#form" aria-controls="machine" role="tab" data-toggle="tab">添加机器</a></li>
  71.         </ul>
  72.       </div>
  73.       <div class="tab-content">
  74.         <div role="tabpanel" class="tab-pane active" id="list">
  75.           <div class="panel-body">
  76.             <div class="row">
  77.               <form>
  78.                 <div class="col-md-3 col-lg-offset-9">
  79.                   <div class="input-group">
  80.                     <input class="form-control" type="text" value="" placeholder="用户名" name="keyword">
  81.                     <span class="input-group-btn">
  82.                     <button type="submit" class="btn btn-primary"><i class="glyphicon glyphicon-search"></i></button>
  83.                   </span>
  84.                   </div>
  85.                 </div>
  86.               </form>
  87.             </div>
  88.           </div>
  89.           <div class="panel panel-default">
  90.             <div class="table-responsive">
  91.               <table class="table table-bordered">
  92.                 <thead>
  93.                 <tr>
  94.                   <th class="w8p">id</th>
  95.                   <th class="w18p">域名</th>
  96.                   <th class="w18p">ip</th>
  97.                   <th class="w13p">sphinx路径</th>
  98.                   <th class="w10p">备注</th>
  99.                   <th class="w15p">创建时间</th>
  100.                   <th class="w15p">操作</th>
  101.                 </tr>
  102.                 </thead>
  103.                 <tbody>
  104.                 <tr>
  105.                   <td class="center">1</td>
  106.                   <td>sphinx.test.com.cn</td>
  107.                   <td>192.168.128.12</td>
  108.                   <td>/usr/local/sphinx</td>
  109.                   <td class="center">主机</td>
  110.                   <td class="center">2017-03-28 12:21:09</td>
  111.                   <td class="center"><a name="remove" onclick="Common.confirm('确认要删除吗？')"><i class="glyphicon glyphicon-remove"></i>删除</a></td>
  112.                 </tr>
  113.                 <tr>
  114.                   <td class="center">2</td>
  115.                   <td>sphinx.test.com.cn</td>
  116.                   <td>192.168.128.13</td>
  117.                   <td>/usr/local/sphinx</td>
  118.                   <td class="center">备机</td>
  119.                   <td class="center">2017-03-28 12:21:09</td>
  120.                   <td class="center"><a name="remove" onclick="Common.confirm('确认要屏蔽吗？')"><i class="glyphicon glyphicon-remove"></i>删除</a></td>
  121.                 </tr>
  122.                 <tr>
  123.                   <td class="center">3</td>
  124.                   <td>sphinx.video.com.cn</td>
  125.                   <td>192.168.158.13</td>
  126.                   <td>/usr/local/sphinx</td>
  127.                   <td class="center">主机</td>
  128.                   <td class="center">2017-03-28 12:21:09</td>
  129.                   <td class="center"><a name="remove" onclick="Common.confirm('确认要屏蔽吗？')"><i class="glyphicon glyphicon-remove"></i>删除</a></td>
  130.                 </tr>
  131.                 <tr>
  132.                   <td class="center">4</td>
  133.                   <td>sphinx.test.com.cn</td>
  134.                   <td>192.168.158.14</td>
  135.                   <td>/usr/local/sphinx</td>
  136.                   <td class="center">备机</td>
  137.                   <td class="center">2017-03-28 12:21:09</td>
  138.                   <td class="center"><a name="remove" onclick="Common.confirm('确认要屏蔽吗？')"><i class="glyphicon glyphicon-remove"></i>删除</a></td>
  139.                 </tr>
  140.                 </tbody>
  141.               </table>
  142.             </div>
  143.             <div class="panel-footer">
  144.               <div class="row">
  145.                 <div class="col-md-8 m-pagination" id="paginator">
  146.                 </div>
  147.               </div>
  148.             </div>
  149.           </div>
  150.         </div>
  151.         <div role="tabpanel" class="tab-pane" id="form">
  152.           <div class="panel-body">
  153.             <form class="form-horizontal">
  154.               <div class="form-group">
  155.                 <label class="col-sm-1 control-label"><span class="text-danger"></span>域名</label>
  156.                 <div class="col-sm-4">
  157.                   <input type="text" name="username" class="form-control" placeholder="机器域名" required>
  158.                 </div>
  159.               </div>
  160.               <div class="form-group">
  161.                 <label class="col-sm-1 control-label"><span class="text-danger"> * </span>IP</label>
  162.                 <div class="col-sm-4">
  163.                   <input type="email" name="email" class="form-control" placeholder="机器ip" required>
  164.                 </div>
  165.               </div>
  166.               <div class="form-group">
  167.                 <label class="col-sm-1 control-label"><span class="text-danger"> * </span>Sphinx<br>安装目录</label>
  168.                 <div class="col-sm-4">
  169.                   <input type="text" name="sphinx_path" class="form-control" placeholder="sphinx安装目录">
  170.                 </div>
  171.               </div>
  172.               <div class="form-group">
  173.                 <label class="col-sm-1 control-label"><span class="text-danger"></span>备注信息</label>
  174.                 <div class="col-sm-4">
  175.                   <input type="text" class="form-control" placeholder="备注" required>
  176.                 </div>
  177.               </div>
  178.               <div class="form-group">
  179.                 <div class="col-sm-offset-1 col-sm-10">
  180.                   <button type="submit" onclick="" class="btn btn-success">保存</button>
  181.                 </div>
  182.               </div>
  183.             </form>
  184.             <hr>
  185.           </div>
  186.         </div>
  187.       </div>
  188.     </div>
  189.   </div>
  190. </div>
  191. <!--footer-->
  192. <footer>
  193.   <div class="container">
  194.     <div class="row">
  195.       <div class="col-md-12">
  196.         <p class="text-muted center">
  197.           Copyright&nbsp;©&nbsp;2017-2018&nbsp;&nbsp;phachon@163.com&nbsp;&nbsp;
  198.         </p>
  199.       </div>
  200.     </div>
  201.   </div>
  202. </footer>
  203. <!--footer-->
  204. <script src="js/plugins/jquery/jquery.js"></script>
  205. <script src="js/bootstrap.min.js"></script>
  206. <script src="js/plugins/pagination/mricode.pagination.js"></script>
  207. <script src="js/plugins/fancybox/jquery.fancybox.js"></script>
  208. <script src="js/plugins/sweetalert/sweetalert.min.js"></script>
  209. <script src="js/common/common.js"></script>
  210. <script src="js/module/account.js"></script>
  211. <script type="text/javascript">
  212.   var pageData = [];
  213.   pageData.push({'pageSize': '10', 'total': '1000', 'pageIndex': '2'});
  214.   Common.paginator("#paginator", pageData);
  215.   Account.bindFancyBox();
  216. </script>
  217. </body>
  218. </html>
复制代码


  • 可以看到HTML中
  1. <table class="table table-bordered">
  2.                 <thead>
  3.                 <tr>
  4.                   <th class="w8p">id</th>
  5.                   <th class="w18p">域名</th>
  6.                   <th class="w18p">ip</th>
  7.                   <th class="w13p">sphinx路径</th>
  8.                   <th class="w10p">备注</th>
  9.                   <th class="w15p">创建时间</th>
  10.                   <th class="w15p">操作</th>
  11.                 </tr>
  12.                 </thead>
  13.                 <tbody>
  14.                 <tr>
  15.                   <td class="center">1</td>
  16.                   <td>sphinx.test.com.cn</td>
  17.                   <td>192.168.128.12</td>
  18.                   <td>/usr/local/sphinx</td>
  19.                   <td class="center">主机</td>
  20.                   <td class="center">2017-03-28 12:21:09</td>
  21.                   <td class="center"><a name="remove" onclick="Common.confirm('确认要删除吗？')"><i class="glyphicon glyphicon-remove"></i>删除</a></td>
  22.                 </tr>
  23.                 <tr>
  24.                   <td class="center">2</td>
  25.                   <td>sphinx.test.com.cn</td>
  26.                   <td>192.168.128.13</td>
  27.                   <td>/usr/local/sphinx</td>
  28.                   <td class="center">备机</td>
  29.                   <td class="center">2017-03-28 12:21:09</td>
  30.                   <td class="center"><a name="remove" onclick="Common.confirm('确认要屏蔽吗？')"><i class="glyphicon glyphicon-remove"></i>删除</a></td>
  31.                 </tr>
  32.                 <tr>
  33.                   <td class="center">3</td>
  34.                   <td>sphinx.video.com.cn</td>
  35.                   <td>192.168.158.13</td>
  36.                   <td>/usr/local/sphinx</td>
  37.                   <td class="center">主机</td>
  38.                   <td class="center">2017-03-28 12:21:09</td>
  39.                   <td class="center"><a name="remove" onclick="Common.confirm('确认要屏蔽吗？')"><i class="glyphicon glyphicon-remove"></i>删除</a></td>
  40.                 </tr>
  41.                 <tr>
  42.                   <td class="center">4</td>
  43.                   <td>sphinx.test.com.cn</td>
  44.                   <td>192.168.158.14</td>
  45.                   <td>/usr/local/sphinx</td>
  46.                   <td class="center">备机</td>
  47.                   <td class="center">2017-03-28 12:21:09</td>
  48.                   <td class="center"><a name="remove" onclick="Common.confirm('确认要屏蔽吗？')"><i class="glyphicon glyphicon-remove"></i>删除</a></td>
  49.                 </tr>
  50.                 </tbody>
  51.               </table>
复制代码

只能是静态的，接下来我们需要将这里的代码修改为与数据库毗连，并遍历打印数据库里面表的信息
第五步：根据jsp文件格式创建数据库



  • 完成上面的代码之后，我们接着创建一个数据库，点击数据库按钮

  • 然后找到加号，点击数据源，找到MySQL

  • 在里面输入我们的密码和用户名

  • 找到部署架构，里面就有我们的数据库文件


  • 在数据库里根据我们的HTML表格格式创建一张表
  • 新建查询语句

  1. CREATE TABLE sphinx_info (
  2.     id INT AUTO_INCREMENT PRIMARY KEY,
  3.     domain VARCHAR(255) NOT NULL,
  4.     ip VARCHAR(45) NOT NULL,
  5.     sphinx_path VARCHAR(255) NOT NULL,
  6.     remark VARCHAR(255) NOT NULL,
  7.     create_time DATETIME NOT NULL,
  8.     operation VARCHAR(20)
  9. );
复制代码


  • 然后到场数据
  1. INSERT INTO sphinx_info (domain, ip, sphinx_path, remark, create_time, operation)
  2. VALUES
  3. ('sphinx.demo1.com', '192.168.100.1', '/usr/local/sphinx', '主机', '2025-05-13 09:30:00', '✖删除'),
  4. ('sphinx.demo2.net', '192.168.100.2', '/usr/local/sphinx', '备机', '2025-05-13 09:35:00', '✖删除'),
  5. ('sphinx.demo3.org', '192.168.100.3', '/usr/local/sphinx', '主机', '2025-05-13 09:40:00', '✖删除'),
  6. ('sphinx.demo4.cn', '192.168.100.4', '/usr/local/sphinx', '备机', '2025-05-13 09:45:00', '✖删除'),
  7. ('sphinx.demo5.io', '192.168.100.5', '/usr/local/sphinx', '主机', '2025-05-13 09:50:00', '✖删除');
复制代码

第六步：利用SQL标签库实现MySQL数据库毗连



  • 首先在表头添加
  1. <%@ taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql" %>
  2. <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>//核心标签声明<c:forEach>属于 JSTL 核心标签库，必须显式声明才能使用。若缺少此声明，会导致标签无法剖析，数据无法遍历显示
复制代码


  • 然后找到我们的jsp文件，将里面需要修改的代码
  1. <tbody>
  2.                 <tr>
  3.                   <td class="center">1</td>
  4.                   <td>sphinx.test.com.cn</td>
  5.                   <td>192.168.128.12</td>
  6.                   <td>/usr/local/sphinx</td>
  7.                   <td class="center">主机</td>
  8.                   <td class="center">2017-03-28 12:21:09</td>
  9.                   <td class="center"><a name="remove" onclick="Common.confirm('确认要删除吗？')"><i class="glyphicon glyphicon-remove"></i>删除</a></td>
  10.                 </tr>
  11.                 <tr>
  12.                   <td class="center">2</td>
  13.                   <td>sphinx.test.com.cn</td>
  14.                   <td>192.168.128.13</td>
  15.                   <td>/usr/local/sphinx</td>
  16.                   <td class="center">备机</td>
  17.                   <td class="center">2017-03-28 12:21:09</td>
  18.                   <td class="center"><a name="remove" onclick="Common.confirm('确认要屏蔽吗？')"><i class="glyphicon glyphicon-remove"></i>删除</a></td>
  19.                 </tr>
  20.                 <tr>
  21.                   <td class="center">3</td>
  22.                   <td>sphinx.video.com.cn</td>
  23.                   <td>192.168.158.13</td>
  24.                   <td>/usr/local/sphinx</td>
  25.                   <td class="center">主机</td>
  26.                   <td class="center">2017-03-28 12:21:09</td>
  27.                   <td class="center"><a name="remove" onclick="Common.confirm('确认要屏蔽吗？')"><i class="glyphicon glyphicon-remove"></i>删除</a></td>
  28.                 </tr>
  29.                 <tr>
  30.                   <td class="center">4</td>
  31.                   <td>sphinx.test.com.cn</td>
  32.                   <td>192.168.158.14</td>
  33.                   <td>/usr/local/sphinx</td>
  34.                   <td class="center">备机</td>
  35.                   <td class="center">2017-03-28 12:21:09</td>
  36.                   <td class="center"><a name="remove" onclick="Common.confirm('确认要屏蔽吗？')"><i class="glyphicon glyphicon-remove"></i>删除</a></td>
  37.                 </tr>
  38.                 </tbody>
复制代码


  • 修改为我们的 SQL 标签库实现 的代码
  1. <tbody>
  2.                 <!-- 配置数据源 -->
  3.                 <sql:setDataSource
  4.                         var="dbConn"
  5.                         driver="com.mysql.cj.jdbc.Driver"
  7.                         url="jdbc:mysql://localhost:3306/2023se3"
  8.                         user="root"
  9.                         password="123456"
  10.                 />
  11.                 <!-- 执行查询 -->
  12.                 <sql:query dataSource="${dbConn}" var="sphinxRs">
  13.                   SELECT id, domain, ip, sphinx_path, remark, create_time, operation
  14.                   FROM sphinx_info
  15.                 </sql:query>
  17.                 <!-- 遍历结果 -->
  18.                 <c:forEach items="${sphinxRs.rows}" var="row">
  19.                   <tr>
  20.                     <td class="center">${row.id}</td>
  21.                     <td>${row.domain}</td>
  22.                     <td>${row.ip}</td>
  23.                     <td>${row.sphinx_path}</td>
  24.                     <td class="center">${row.remark}</td>
  25.                     <td class="center">${row.create_time}</td>
  26.                     <td class="center">
  27.                       <a href="deleteSphinx.jsp?id=${row.id}" onclick="return confirm('确认要删除吗？')">
  28.                         <i class="glyphicon glyphicon-remove"></i>${row.operation}
  29.                       </a>
  30.                     </td>
  31.                   </tr>
  32.                 </c:forEach>
  33.                 </tbody>
复制代码


  • 下面我们来具体讲解一下代码
  1. <sql:setDataSource
  2.     var="dbConn"
  3.     driver="com.mysql.cj.jdbc.Driver"
  4.     url="jdbc:mysql://localhost:3306/2023se3"
  5.     user="root"
  6.     password="123456"
  7. />
复制代码


  • 借助 <sql:setDataSource> 标签，创建了一个名为 dbConn 的数据源对象。
  • 该对象使用 MySQL 驱动步伐，毗连到本地 3306 端口的 2023se3 数据库，登录用户为 root，密码是 123456。
  1. <sql:query dataSource="${dbConn}" var="sphinxRs">
  2.     SELECT id, domain, ip, sphinx_path, remark, create_time, operation
  3.     FROM sphinx_info
  4. </sql:query>
复制代码


  • 利用 <sql:query> 标签实行 SQL 查询操作。
  • 从 sphinx_info 表中选取 7 个字段的数据。
  • 查询结果会存放在 sphinxRs 变量里，这个变量是一个包罗多行数据的聚集。
  1. <c:forEach items="${sphinxRs.rows}" var="row">
  2.     <tr>
  3.         <td class="center">${row.id}</td>
  4.         <td>${row.domain}</td>
  5.         <td>${row.ip}</td>
  6.         <td>${row.sphinx_path}</td>
  7.         <td class="center">${row.remark}</td>
  8.         <td class="center">${row.create_time}</td>
  9.         <td class="center">
  10.             <a href="deleteSphinx.jsp?id=${row.id}" onclick="return confirm('确认要删除吗？')">
  11.                 <i class="glyphicon glyphicon-remove"></i>${row.operation}
  12.             </a>
  13.         </td>
  14.     </tr>
  15. </c:forEach>
复制代码


  • <c:forEach> 标签会遍历结果集里的每一行数据。
  • 针对每一行数据，都会生成一个 <tr>（表格行）。
  • 每个 <td>（表格单元格）会显示对应字段的值，像 ID、域名、IP 等。
  • 末了一列是操作列，包罗一个删除链接，点击该链接会调用 deleteSphinx.jsp 并附带当前行的 ID。
  • onclick 事件会弹出确认对话框，防止用户误操作。
  • 然后点击运行

  • 可以看到我们的数据库信息成功打印到屏幕上了

以上就是这篇博客的全部内容，下一篇我们将继续探索JSP的更多精彩内容。
   我的个人主页，接待来阅读我的其他文章
https://blog.csdn.net/2402_83322742?spm=1011.2415.3001.5343
我的JSP知识文章专栏
接待来阅读指出不敷
https://blog.csdn.net/2402_83322742/category_12950980.html?spm=1001.2014.3001.5482
  
非常感谢您的阅读，喜好的话记得三连哦
[table][/table]


免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。

本帖子中包含更多资源

您需要 登录 才可以下载或查看，没有账号？立即注册

x
回复

使用道具 举报

0 个回复

倒序浏览
返回列表

快速回复

高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

商道如狼道

论坛元老
这个人很懒什么都没写!

楼主热帖

标签云

渠道 国产数据库 集成商 AI 运维 CIO 存储 服务器
微信订阅号
微信服务号
微信客服
小程序
H5
关于我们 商务合作 网站地图
©Copyright 2022-2024 杭州祥升科技有限公司 版权所有 浙ICP备20004199号
快速回复 返回顶部 返回列表