关键字搜索功能+分页

最新推荐文章于 2024-08-04 17:16:44 发布
最新推荐文章于 2024-08-04 17:16:44 发布
阅读量514 收藏 1
点赞数
文章标签： java
原文链接：http://www.cnblogs.com/xiejiusi/p/7743610.html
版权

 

图片
form表单的action地址一定要与controller中对应方法的value地址相同
如：
@RequestMapping(value =  "xxx",method = RequestMethod.POST) 

图片
控制器中要注意：参数 String keywords;对应的是form表单中的 'name="keywords" '如果 表单中name值改变，控制器参数
也要随之改变，否则找不到值。
上图
(1)、创建Article对象 
(2)、将从form表单获取的keywords（关键字字段）set至 Article对象中。
(3)、调用articleService的findList方法 查询到所有值并存放在li中

图片 
上图为JSP中的展示页面。
items的值与图2中model值对应
以上所有步骤可以实现点击搜索展示所有带有搜索关键字的文章

以下重构
图片
用model将需要的值带回到JSP页面（后面会用到）

图片 
之前展示的是所有的值，重构之后每页最多展示10个
 
图片 注意location的跳转地址；为了适应中文关键字搜索 在后面加了段代码 encodeURI(~~~~~)
并且要增加一个GET方法（我也不知道为啥）
图片 

最终结果大概就只这个吊样
图片 

 

转载于:https://www.cnblogs.com/xiejiusi/p/7743610.html

dayin0296
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
模糊查询 + 分页 有坑！
lisu061714112的专栏
09-15 1627
不知道你有没有使用过Mysql的like语句，进行模糊查询？不知道你有没有将查询结果，进行分页处理？模糊查询，加上分页处理，会有意想不到的坑，不信我们继续往下看。我之前提供过一个品牌查询接口，给前端品牌选择控件使用的。当时为了性能考虑，怕前端控件因为一次性加载太多的品牌，而导致页面卡死。因此，对品牌查询接口做了分页处理。刚开始品牌表的数据比较少，没有出现什么问题。后来，产品加需求了，在品牌下拉选择控件中，让用户可以输入自定义品牌。
node+vue搜索和分页功能实现
qq_60976312的博客
05-09 961
node+vue搜索和分页功能实现 $regex运算符讲解
php关键字传到分页,php中带关键字搜索功能的分页函数的设计及实例
weixin_34135138的博客
03-28 165
在网站中经常用到分页功能，因此将分页功能封装成一个函数，在调用时可以减少编程工作量。1. 分页函数的设计：这里分页函数输入有五个参数：记录总数$RecordTotalNum，每页显示的记录数$PerPageSize，当前显示的页数$Page，当前页的$url，查询关键字$keyword，只要设置好这5个参数(如果没有查询关键字$keyword可不设计)，就可以调用分页函数了。该分页函数的功能主要是...
微信小程序+PHP 搜索+分页
Your_is_my_God的博客
12-17 1067
1、小程序wxml 小程序选择器 <view class="section"> <view class="section__title">选择发布类型</view> <picker bindchange="bindType" value="{{index}}" range="{{array}}"> <view class="picker"> 当前选择：{{array[index]}} </view> <..
分页 搜索html,搜索+分页-标注列表-示例中心-JS API UI 组件示例 | 高德地图API
weixin_36420854的博客
06-07 263
搜索+分页#keywords {position: absolute;right: 310px;top: 7px;line-height: 200%;padding: 0 5px;font-size: 13;border-radius: 3px;border: 1px solid #ccc;width: 150px;}//创建地图var map = new AMap.Map('container'...
php中带关键字搜索功能的分页函数的设计及实例
BIN_GOO的博客
07-24 3288
在网站中经常用到分页功能，因此将分页功能封装成一个函数，在调用时可以减少编程工作量。 1. 分页函数的设计： 这里分页函数输入有五个参数：记录总数$RecordTotalNum，每页显示的记录数$PerPageSize，当前显示的页数$Page，当前页的$url，查询关键字$keyword，只要设置好这5个参数（如果没有查询关键字$keyword可不设计），就可以调用分页函数了。
高德+关键字搜索+java_利用高德地图关键字检索POI-实现仿微信发朋友圈搜索附近位置...
weixin_33269198的博客
03-01 977
前言由于项目中需要实现搜索附近位置作为收获地址，所以采用了高德地图的关键字检索POI来实现。官方Demo看了很复杂，估计很多人都不想看。但是看了我写的Demo你就会觉得So Easy啦！先上效果图高德提供了千万级别的 POI(Point of Interest，兴趣点)。在地图表达中，一个 POI 可代表一栋大厦、一家商铺、一处景点等等。通过POI搜索，完成找餐馆、找景点、找厕所等等的功能。地图 ...
vue+elementui +input输入框关键字筛选检索表格数据展示+分页功能
weixin_30619101的博客
07-05 1081
第一种用axios发送请求到后台，需要后台配合，才能在表格里面渲染页面；想偷懒的小伙建议去直接粘贴复制第三种 <template> <div class="tableDatas"> <div class="searchWord"> <div style="display: inline-block"> 搜索：</div&g...
JavaWEB九：thymeleaf 之 分页显示和关键字查询
开发者
03-14 1296
Thymeleaf二：增删改查扩展 一、分页显示 在全查询的基础上，增加了一个参数。 重点是控制首页、上一页、下一页、尾页的可点击情况 DAO的实现类 public class ListIpm extends BaseDAO<Customers> implements ListDAO{ // 分页显示 @Override public List<Customers> getList(Connection conn ,int pageOn) {
Vue 实现分页与输入框关键字筛选功能
12-30
分页的实现(Vue+Element)+输入框关键字筛选 1.这里用的是Element 自带的分页组件 订单列表 <div class=search-box><input type=text name= id= class=order-search-input placeholder=关键词 v-model='search...
Spring+SpringMVC+MyBatis+Oracl+分页 增删改查功能
07-12
标题 "Spring+SpringMVC+MyBatis+Oracle+分页 增删改查功能" ...开发者可以通过这个Demo了解如何将这些组件集成起来，实现数据库的增删改查以及分页和搜索功能，同时学习如何进行分页页数的校验以增强应用的安全性。
PDF大文件按关键字分页提取功能
10-17
以上就是关于PDF大文件按关键字分页提取功能的详细说明，涵盖PDFBox库的使用、PDF文档结构、关键字搜索以及分页提取的实现步骤。通过这个功能，我们可以高效地处理大量PDF文档，为数据分析、信息检索等工作带来便利...
微信小程序之搜索分页功能的实现代码
08-19
例如，在上面的代码中，input 组件的 bindinput 事件被绑定到 changeModel 函数上，当用户输入搜索关键字时，changeModel 函数将被触发，从而实现搜索功能。 知识点三：分页功能的实现 分页功能是微信小程序搜索...
GridView高效分页和搜索功能的实现代码
10-27
本文将介绍如何在GridView中实现高效分页和搜索功能。 首先，高效分页的关键在于不一次性加载所有数据，而是根据当前页数只从数据库获取对应页的数据。这通常通过SQL查询中的OFFSET和FETCH或TOP关键字来实现，或者...
枚举工具类
qq_43049583的博客
08-04 120
java枚举工具类
等待唤醒机制两种实现方法-阻塞队列
泰勒今天想展开的博客
08-04 174
桌子上有面条-》吃货执行桌子上没面条-》生产者制造执行。
社区养老服务小程序的设计
Karen198的博客
07-31 568
管理员账户功能包括：系统首页，个人中心，用户管理，服务人员管理，服务产品管理，服务预约管理，服务状态管理，服务退订管理，活动管理，视频管理。主要技术：Java,Spring,mybatis,mysql,jquery,html。服务器：SpringBoot自带 apache tomcat。微信端账号功能包括：系统首页，服务产品，活动，视频，我的。JDK版本：Java JDK1.8。数据库可视化工具： navicat。数据库版本： mysql5.7。开发工具：IDEA(推荐)开发系统：Windows。
Servlet(2)
最新发布
xjdkxnhcoskxbco的博客
08-04 332
这个注解可以用来修饰一个Servlet类，可以简化配置，替代Web.xml中 的servlet配置。
vue+node如何实现表格的分页
04-03
1. 数据库查询分页 首先需要在后端通过数据库查询获取到所有数据，然后再根据前端传来的分页参数进行分页处理，最后将分页后的数据返回给前端。 例如使用MySQL数据库，在Node.js中可以使用mysql模块连接数据库，然后通过LIMIT和OFFSET关键字进行分页查询。 ``` const mysql = require('mysql'); const connection = mysql.createConnection({ host: 'localhost', user: 'root', password: 'password', database: 'test' }); // 获取总记录数 function getCount(callback) { const sql = 'SELECT COUNT(*) AS total FROM table_name'; connection.query(sql, (error, results) => { if (error) throw error; callback(results[0].total); }); } // 分页查询 function getList(pageNum, pageSize, callback) { const offset = (pageNum - 1) * pageSize; const sql = `SELECT * FROM table_name LIMIT ${pageSize} OFFSET ${offset}`; connection.query(sql, (error, results) => { if (error) throw error; callback(results); }); } ``` 2. 前端分页 前端分页是指在前端将所有数据加载完毕后，通过JS来进行分页处理，最终将分页后的数据呈现在页面上。 例如使用Vue.js，可以在组件中定义一个列表，然后使用computed属性计算分页数据。 ``` <template> <div> <table> <thead> <tr> <th>id</th> <th>name</th> <th>age</th> </tr> </thead> <tbody> <tr v-for="item in paginatedList" :key="item.id"> <td>{{ item.id }}</td> <td>{{ item.name }}</td> <td>{{ item.age }}</td> </tr> </tbody> </table> <div> <button @click="prevPage">上一页</button> <span>{{ currentPage }} / {{ pageCount }}</span> <button @click="nextPage">下一页</button> </div> </div> </template> <script> export default { data() { return { list: [], // 所有数据 pageSize: 10, // 每页显示条数 currentPage: 1 // 当前页码 }; }, computed: { pageCount() { return Math.ceil(this.list.length / this.pageSize); // 总页数 }, paginatedList() { const startIndex = (this.currentPage - 1) * this.pageSize; const endIndex = startIndex + this.pageSize; return this.list.slice(startIndex, endIndex); // 分页后的数据 } }, methods: { prevPage() { if (this.currentPage > 1) { this.currentPage--; } }, nextPage() { if (this.currentPage < this.pageCount) { this.currentPage++; } } }, mounted() { // 获取所有数据 // ... } }; </script> ``` 需要注意的是，前端分页虽然不需要进行数据库分页查询，但是在数据量较大时仍然会存在性能问题。因此，建议在数据量较大时使用后端分页查询方式。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值