LayUi搜索时，如何只刷新表格内容，其他内容不变？ |
您所在的位置：网站首页 › layui数据表格实时刷新 › LayUi搜索时，如何只刷新表格内容，其他内容不变？ |
LayUi搜索时，如何只刷新表格内容，其他内容不变？
|
相关阅读：
Spring Boot 踩坑系列之Error resolving template Maven项目中引入net.sf.json.JSONObject依赖jar包 X-admin2.2表单提交方式及注意事项 X-admin2.2中switch开关的监听，以及属性值获取和更改状态等操作 Spring Boot集成X-admin2.2时，Layui字体图标无法正常显示或乱码问题解决方法 ZTree工具类汇总，包括：新增、编辑和删除节点，并提交后台 最近在基于SpringBoot+Frammark+X-admin2.2框架，开发一套自己的后台框架，其中部门管理部分涉及到ZTree和LayUi动态表格结合使用的场景。 同时发现LayUi表格上方的搜索框在回车或点击搜索按钮时，是刷新整个页面，而不是表格。这样就导致左侧树节点选择状态消失，虽然可以想办法解决，不过太麻烦了。最后决定改变默认的监控。
1：修改搜索按钮标签： # 2：添加监听数据库回车、搜索“按钮” layui.use('table', function() { var table = layui.table; var isSearch = false; //输入框回车执行搜索 $("#name").bind('keydown', function(event) { if (event.keyCode == 13) { nodeId = getNodeId() table.reload("test", { // 此处是上文提到的 初始化标识id where : { name : $('#name').val(), nodeId : nodeId } }); isSearch = true; return false; } }); //点击搜索按钮执行搜索 $("#searchBtn").bind('click', function(event) { nodeId = getNodeId() table.reload("test", { // 此处是上文提到的 初始化标识id where : { name : $('#name').val(), nodeId : nodeId } }); isSearch = true; return false; }); //监听搜索变化 var keyWord = document.getElementById("name"); keyWord.oninput = function(e) { if (keyWord.value === '' || keyWord.value === null) { if (isSearch) { nodeId = getNodeId() table.reload("test", { // 此处是上文提到的 初始化标识id where : { name : $('#name').val(), nodeId : nodeId } }); } isSearch = false; } }; });这样就可以在搜索时，只是重新刷新表格内容，其他部分数据不变化。 |
【本文地址】
今日新闻 |
推荐新闻 |