layui的数据表格+springmvc如何实现搜索功能
这篇文章将为大家详细讲解有关layui的数据表格+springmvc如何实现搜索功能,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。
创新互联公司专注为客户提供全方位的互联网综合服务,包含不限于成都做网站、网站建设、外贸营销网站建设、宿州网络推广、微信小程序开发、宿州网络营销、宿州企业策划、宿州品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等,从售前售中售后,我们都将竭诚为您服务,您的肯定,是我们最大的嘉奖;创新互联公司为所有大学生创业者提供宿州建站搭建服务,24小时服务热线:13518219792,官方网址:www.cdcxhl.com
如下所示:
主要在前端页面加:
搜索ID:
在js中加上:
reload:function () { var keyWord=$("#keyWord").val(); var keyType=$("#key_type option:selected").val(); table.reload('contenttable',{ method:'post', where:{keyWord:keyWord,keyType:keyType} }); }
js的全貌:
通过reroad重载把参数传到springmvc后台进行模糊查询,再把查到的数据返回就好了。
其中springmvc控制层代码:
/** * layui-content后台代码 * @return */ @RequestMapping(value = "/backContent") @ResponseBody public ResultMap> backContent(Page page, @RequestParam("limit") int limit){ page.setRows(limit); List
contentList=contentService.selectPageList(page); int totals=contentService.selectPageCount(page); page.setTotalRecord(totals); return new ResultMap >(0,"",totals,contentList); }
因为layui返回的参数不单单是json数组,要符号其的数据格式才能在jsp页面显示数据,所以用ResultMap类来处理返回数据的格式。
package net.stxy.one.model; /** * * layui数据表格返回数据处理类 * Created by ASUS on 2018/5/19 * * @Authod Grey Wolf */ public class ResultMap{ private String msg; private T data; private int code; private int count; public String getMsg() { return msg; } public void setMsg(String msg) { this.msg = msg; } public T getData() { return data; } public void setData(T data) { this.data = data; } public int getCode() { return code; } public void setCode(int code) { this.code = code; } public int getCount() { return count; } public void setCount(int count) { this.count = count; } public ResultMap(int code,String msg, int count,T data) { this.code = code; this.msg = msg; this.count = count; this.data = data; } public ResultMap() { } }
其中mapper的语句:
layui是什么
layui是一款采用自身模块规范编写的前端UI框架,它遵循原生HTML/CSS/JS的书写与组织形式,门槛极低,适合新手,并且它还提供了丰富的内置模块,他们皆可通过模块化的方式按需加载,从核心代码到API的每一处细节都经过精心雕琢,非常适合界面的快速开发,能够作为PC网页端后台系统与前台界面的速成开发方案。
关于“layui的数据表格+springmvc如何实现搜索功能”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看到。
本文名称:layui的数据表格+springmvc如何实现搜索功能
标题网址:http://ybzwz.com/article/gejhij.html