当前位置: 首页 > news >正文

关于LayUI表格重载数据问题

目的

搜索框搜索内容重载数据只显示搜索到的结果

遇到的问题

在layui官方文档里介绍的table属性有data项,但使用下列代码

table.reload('test', {data:data  //data为json数据});

时发现,会会重新调用table.render的url拿到原来的数据,并不会显示出来传输的data数据,估计应该只有table.render有这个属性。

原因

table.reload执行会重新调用table.render来渲染实例

解决方案

可以使用where进行传参,然后后端判断Str就可以区分是哪里调用的了,具体参考后面代码

table.reload('test', {where: {Str: value},});

部分代码

表格和搜索框

<div style="padding: 16px;"><table class="layui-hide" id="test" lay-filter="test"></table>
</div>       <div class="layui-input-wrap" style="width: 300px;right: -80%;"><input type="text" id="searchtext" lay-affix="search"  lay-filter="search" lay-options="{split: true}" placeholder="搜索…" class="layui-input">
</div>

表格渲染

table.render({elem: '#test',url: '/GetAllTemp',method: 'post',toolbar: '#toolbarDemo',height: 'full-35',css: [ // 重设当前表格样式'.layui-table-tool-temp{padding-right: 145px;}'].join(''),cellMinWidth: 80,totalRow: true,page: true,cols: [[{type: 'checkbox', fixed: 'left'},{field:'id', fixed: 'left', width:100, title: '<%=ExamTemp.tid%>'},{field:'b', width:300, title: '<%=ExamTemp.tb%>'},{field:'c', width:250, title: '<%=ExamTemp.tc%>'},{field:'d', title:'<%=ExamTemp.td%>', width: 300},{field:'e', title:'<%=ExamTemp.te%>', width: 300},{fixed: 'right', title:'操作', width: 134, minWidth: 125, toolbar: '#barDemo'}]],done: function(res, curr, count, origin){...

搜索框事件(表格重载数据)

           form.on('input-affix(search)', function(data){  // 搜索var elem = data.elem; // 输入框var value = elem.value; // 输入框的值if(!value){layer.msg('请输入搜索内容');return elem.focus()};// 搜索重载数据table.reload('test', {where: {Str: value},});});

后端 获取数据

判断一下Str是不是空的就可以区分是一开始渲染还是重载了

@WebServlet("/GetAllTemp")
public class GetAllTempServlet extends HttpServlet {AllTemplateService ats = new AllTemplateServiceImpl();@Overrideprotected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {req.setCharacterEncoding("utf-8");resp.setCharacterEncoding("utf-8");String Str = req.getParameter("Str");if (Str==null){int uid = Integer.parseInt(req.getSession().getAttribute("uid").toString());System.out.println("uid: "+uid);List<AllTemplate> allTemplates = ats.getAllTemp();JsonMassage<AllTemplate> JSM = new JsonMassage("0", "", allTemplates);String json = JSM.toJSONString();resp.getWriter().write(json);}else {List<AllTemplate> allTemplates = ats.getTempByStr(Str);JsonMassage<AllTemplate> JSM = new JsonMassage("0", "", allTemplates);String json = JSM.toJSONString();resp.getWriter().write(json);}}
}

相关文章:

关于LayUI表格重载数据问题

目的 搜索框搜索内容重载数据只显示搜索到的结果 遇到的问题 在layui官方文档里介绍的table属性有data项,但使用下列代码 table.reload(test, {data:data //data为json数据}); 时发现&#xff0c;会会重新调用table.render的url拿到原来的数据&#xff0c;并不会显示出来传…...

MyBatis-mapper.xml配置

1、配置获取添加对象的ID <!-- 配置我们的添加方法&#xff0c;获取到新增加了一个monster对象的iduseGeneratedKeys"true" 意思是需要获取新加对象的主键值keyProperty"monster_id" 表示将获取到的id值赋值给Monster对象的monster_id属性 --><…...

【如何选择Mysql服务器的CPU核数及内存大小】

文章目录 &#x1f50a;博主介绍&#x1f964;本文内容&#x1f4e2;文章总结&#x1f4e5;博主目标 &#x1f50a;博主介绍 &#x1f31f;我是廖志伟&#xff0c;一名Java开发工程师、Java领域优质创作者、CSDN博客专家、51CTO专家博主、阿里云专家博主、清华大学出版社签约作…...

【从浅到深的算法技巧】4.静态方法

1.1.6静态方法 在许多语言中&#xff0c;静态方法被称为函教&#xff0c;静态方法是一组在被调用时会被顺序执行的语句。修饰符static将这类方法和1.2的实例方法区别开来。当讨论两类方法共有的属性时我们会使用不加定语的方法一词。 1.1.6.1静态方法 方法封装了由一系列语句…...

YOLO手部目标检测

手部目标检测原文地址如下&#xff1a;手部关键点检测2&#xff1a;YOLOv5实现手部检测(含训练代码和数据集)_yolov5 关键点检测-CSDN博客 手部检测数据集地址如下&#xff1a; 手部关键点检测1&#xff1a;手部关键点(手部姿势估计)数据集(含下载链接)_手关键点数据集-CSDN博…...

网络IP地址如何更改?怎么使用动态代理IP提高网速?

网络IP地址更改以及使用动态代理IP提高网速的步骤如下&#xff1a; 一、更改IP地址 1. 打开浏览器&#xff0c;输入路由器登陆地址并登陆路由器后台管理界面。 2. 找到“高级设置”或“无线设置”或“VPN设置”一栏&#xff0c;点击“断开”&#xff0c;即可断开网络&#xff0…...

Flink实时电商数仓之DWS层

需求分析 关键词 统计关键词出现的频率 IK分词 进行分词需要引入IK分词器&#xff0c;使用它时需要引入相关的依赖。它能够将搜索的关键字按照日常的使用习惯进行拆分。比如将苹果iphone 手机&#xff0c;拆分为苹果&#xff0c;iphone, 手机。 <dependency><grou…...

MFC - CArchive/内存之间的序列化应用细节

文章目录 MFC - CArchive/内存之间的序列化应用细节概述笔记END MFC - CArchive/内存之间的序列化应用细节 概述 有个参数文件, 开始直接序列化到文件. 现在优化程序, 不想这个参数文件被用户看到. 想先由参数发布程序(自己用)设置好参数后, 加个密落地. 等用户拿到后, 由程序…...

C语言实验4:指针

目录 一、实验要求 二、实验原理 1. 指针的基本概念 1.1 指针的定义 1.2 取地址运算符&#xff08;&&#xff09; 1.3 间接引用运算符&#xff08;*&#xff09; 2. 指针的基本操作 2.1 指针的赋值 2.2 空指针 3. 指针和数组 3.1 数组和指针的关系 3.2 指针和数…...

项目——————————

C/C Linux Socket网络编程 TCP 与 UDP_c 语言tcp socket cleint read-CSDN博客C/C Socket - TCP 与 UDP 网络编程_c socket udp-CSDN博客 登录—专业IT笔试面试备考平台_牛客网...

【论文阅读】Realtime multi-person 2d pose estimation using part affinity fields

OpenPose&#xff1a;使用PAF的实时多人2D姿势估计。 code&#xff1a;GitHub - ZheC/Realtime_Multi-Person_Pose_Estimation: Code repo for realtime multi-person pose estimation in CVPR17 (Oral) paper&#xff1a;[1611.08050] Realtime Multi-Person 2D Pose Estima…...

图像分割实战-系列教程9:U2NET显著性检测实战1

&#x1f341;&#x1f341;&#x1f341;图像分割实战-系列教程 总目录 有任何问题欢迎在下面留言 本篇文章的代码运行界面均在Pycharm中进行 本篇文章配套的代码资源已经上传 U2NET显著性检测实战1 1、任务概述...

RK3568平台 Android13 GKI架构开发方式

一.GKI简介 GKI&#xff1a;Generic Kernel Image 通用内核映像。 Android13 GMS和EDLA认证的一个难点是google强制要求要支持GKI。GKI通用内核映像&#xff0c;是google为了解决内核碎片化的问题&#xff0c;而设计的通过提供统一核心内核并将SoC和板级驱动从核心内核移至可加…...

阿里云服务器节省计划价格便宜_成本优化全解析

阿里云服务器付费模式节省计划怎么收费&#xff1f;为什么说节省计划更节省成本&#xff1f;节省计划是一种折扣权益计划&#xff0c;可以抵扣按量付费实例&#xff08;不含抢占式实例&#xff09;的账单。相比包年包月实例&#xff0c;以及预留实例券和按量付费实例的组合&…...

3种依赖管理工具实现requirements.txt文件生成

1.pip 实现方式 要使用 pip 生成 requirements.txt 文件&#xff0c;可以使用以下命令&#xff1a; pip freeze > requirements.txt这个命令会将当前环境中所有已安装的 Python 包及其版本信息输出到 requirements.txt 文件中。这个文件可以用于共享项目的依赖信息&#xf…...

超图iClient3DforCesium地形、影像、模型、在线影像交互示例

超图iClient3DforCesium地形、影像、模型、在线影像交互示例 描述示例代码 描述 数据源&#xff1a;基于iserver发布的三维场景(地形、影像、BIM模型) 在线arcgis影像 应用&#xff1a;目录树展示源数据列表、目录树控制源数据可视化结果显隐、BIM模型点选查询关联属性 示例代…...

【解决】电脑上的WIFI图标不见了咋整?

相信不少同学都遇到过这种情况&#xff1a;电脑上的wifi图标莫名不见了&#xff0c;甚至有时候还是在使用的中途突然断网消失的。 遇到这种情况一般有两种解决方案&#xff1a; 1. 在开机状态下长按电源键30秒以上 这种办法应该是给主板放电&#xff0c;一般应用在wifi6上面。…...

2 - 表结构 | MySQL键值

表结构 | MySQL键值 表管理1. 库的操作2. 表的操作表的创建与删除表的修改复制表 3. 管理表记录 数据类型数值类型字符类型&#xff08;汉字或者英文字母&#xff09;日期时间类型 表头存储与日期时间格式的数据枚举类型 数据批量处理 表管理 客户端把数据存储到数据库服务器上…...

Redis(Linux版本7.2.3)

1、停止Redis服务器 [roottssvr1-c1 sysconfig]# ps -ef | grep redis root 322 1 0 10月30 ? 02:58:53 ./bin/redis-server 0.0.0.0:6379 root 32664 12498 0 14:45 pts/0 00:00:00 grep --colorauto redis [roottssvr1-c1 sysconfig]# [roottssvr…...

八股文打卡day18——操作系统(1)

面试题&#xff1a;进程和线程的区别&#xff1f; 我的回答&#xff1a; 1.概念上。进程是系统进行资源分配和调度的基本单位。线程是系统进行运算调度的最小单位。线程是进程的子任务&#xff0c;一个进程至少包含一个线程&#xff0c;一个进程可以运行多个线程&#xff0c;…...

Cursor实现用excel数据填充word模版的方法

cursor主页&#xff1a;https://www.cursor.com/ 任务目标&#xff1a;把excel格式的数据里的单元格&#xff0c;按照某一个固定模版填充到word中 文章目录 注意事项逐步生成程序1. 确定格式2. 调试程序 注意事项 直接给一个excel文件和最终呈现的word文件的示例&#xff0c;…...

大数据零基础学习day1之环境准备和大数据初步理解

学习大数据会使用到多台Linux服务器。 一、环境准备 1、VMware 基于VMware构建Linux虚拟机 是大数据从业者或者IT从业者的必备技能之一也是成本低廉的方案 所以VMware虚拟机方案是必须要学习的。 &#xff08;1&#xff09;设置网关 打开VMware虚拟机&#xff0c;点击编辑…...

vue3 定时器-定义全局方法 vue+ts

1.创建ts文件 路径&#xff1a;src/utils/timer.ts 完整代码&#xff1a; import { onUnmounted } from vuetype TimerCallback (...args: any[]) > voidexport function useGlobalTimer() {const timers: Map<number, NodeJS.Timeout> new Map()// 创建定时器con…...

Module Federation 和 Native Federation 的比较

前言 Module Federation 是 Webpack 5 引入的微前端架构方案&#xff0c;允许不同独立构建的应用在运行时动态共享模块。 Native Federation 是 Angular 官方基于 Module Federation 理念实现的专为 Angular 优化的微前端方案。 概念解析 Module Federation (模块联邦) Modul…...

WEB3全栈开发——面试专业技能点P2智能合约开发(Solidity)

一、Solidity合约开发 下面是 Solidity 合约开发 的概念、代码示例及讲解&#xff0c;适合用作学习或写简历项目背景说明。 &#x1f9e0; 一、概念简介&#xff1a;Solidity 合约开发 Solidity 是一种专门为 以太坊&#xff08;Ethereum&#xff09;平台编写智能合约的高级编…...

《基于Apache Flink的流处理》笔记

思维导图 1-3 章 4-7章 8-11 章 参考资料 源码&#xff1a; https://github.com/streaming-with-flink 博客 https://flink.apache.org/bloghttps://www.ververica.com/blog 聚会及会议 https://flink-forward.orghttps://www.meetup.com/topics/apache-flink https://n…...

【JavaSE】绘图与事件入门学习笔记

-Java绘图坐标体系 坐标体系-介绍 坐标原点位于左上角&#xff0c;以像素为单位。 在Java坐标系中,第一个是x坐标,表示当前位置为水平方向&#xff0c;距离坐标原点x个像素;第二个是y坐标&#xff0c;表示当前位置为垂直方向&#xff0c;距离坐标原点y个像素。 坐标体系-像素 …...

tree 树组件大数据卡顿问题优化

问题背景 项目中有用到树组件用来做文件目录&#xff0c;但是由于这个树组件的节点越来越多&#xff0c;导致页面在滚动这个树组件的时候浏览器就很容易卡死。这种问题基本上都是因为dom节点太多&#xff0c;导致的浏览器卡顿&#xff0c;这里很明显就需要用到虚拟列表的技术&…...

项目部署到Linux上时遇到的错误(Redis,MySQL,无法正确连接,地址占用问题)

Redis无法正确连接 在运行jar包时出现了这样的错误 查询得知问题核心在于Redis连接失败&#xff0c;具体原因是客户端发送了密码认证请求&#xff0c;但Redis服务器未设置密码 1.为Redis设置密码&#xff08;匹配客户端配置&#xff09; 步骤&#xff1a; 1&#xff09;.修…...

python执行测试用例,allure报乱码且未成功生成报告

allure执行测试用例时显示乱码&#xff1a;‘allure’ &#xfffd;&#xfffd;&#xfffd;&#xfffd;&#xfffd;ڲ&#xfffd;&#xfffd;&#xfffd;&#xfffd;ⲿ&#xfffd;&#xfffd;&#xfffd;Ҳ&#xfffd;&#xfffd;&#xfffd;ǿ&#xfffd;&am…...