精华内容
下载资源
问答
  • 一,大家在使用Layui框架时,关闭子窗体后需要刷新父页面或者当前页面; 但是由于Layui框架自身默认刷新时,自动回到首页; 打开子页面代码如下: layer.open({ type: 2, title: "余额查询", content: '/...

    一,大家在使用Layui框架时,关闭子窗体后需要刷新父页面或者当前页面;

       但是由于Layui框架自身默认刷新时,自动回到首页;

        打开子页面代码如下:

    layer.open({
        type: 2,
        title: "余额查询",
        content: '/payaccount-admin/templates/rms_sys/wallet/queryBalance.html?walletNumberCode=' + current_data.numberCode + '&merchantNo=' + current_data.merchantNo,
        maxmin: false,
        area: ['20%', '435px'],
    });

     

      queryBalance.html 为单独的HTML页面

       (1) 关闭子页面【子页面为单独的】,刷新父页面并停留在当前页而非首页:

                 

    let index = parent.layer.getFrameIndex(window.name);
    parent.layer.close(index);  
    parent.layui.table.reload("menuTable");

     

       说明 menuTable 为父页面表格的ID

     (2)提示框消失后,需要刷新当前页面;

       如下提示框6秒消失,后刷新当前表格页面(父页面表格ID为menuTable)

    layer.msg('操作成功', {icon: 6});
    // 刷新的表格页面: 
    table.reload("menuTable",{page:{curr:$(".layui-laypage-em").next().html()}});
    


     

     

     

             

    展开全文
  • 发送http请求之后要刷新表格,原来的做法是请求成功后重新table.render加载表格,但是会造成每次都会回到第一页的情况。 利用layui自带的table.reload();方法可以解决,括号内填入表格的id(不带#),不要使用page...

    项目中有个需求,用的layui的数据表格自带分页,需要对表格数据进行审批或驳回。

    发送http请求之后要刷新表格,原来的做法是请求成功后重新table.render加载表格,但是会造成每次都会回到第一页的情况。

    利用layui自带的table.reload();方法可以解决,括号内填入表格的id(不带#),不要使用page的curr参数

    展开全文
  • 问题1:layui如何做到刷新表格 而不重新渲染 使用如下方法重新加载表格时会出现页面闪动,以及表格位置会重置的问题 deviceTable.reload() 目前有如下方法可以实现刷新的同时而不重新渲染页面 首先你需要结合layui...

    问题1:layui如何做到刷新表格 而不重新渲染

    使用如下方法重新加载表格时会出现页面闪动,以及表格位置会重置的问题

    deviceTable.reload()
    

    目前有如下方法可以实现刷新的同时而不重新渲染页面
    首先你需要结合layui表格插件和layui分页插件

    let xxxTable= table.render({
    	......
    	page: {
    		layout: ['prev', 'next', 'page', 'skip', 'count', 'limit', 'refresh']
    	}
    	......
    });
    

    使用上述代码会覆盖你的分页按钮,可自由调整按钮顺序,各参数含义如下
    prev上一页按钮
    next下一页按钮
    page 1,2,3,4 页码按钮
    skip输入页码跳转按钮
    count总数据数量显示
    limit每页显示数据限制选择
    refresh刷新按钮(本文核心)

    由于该刷新按钮只能在页码这一行,如果不满足你的需求,我们可以通过jQuery调用该按钮的点击事件从而达到不渲染刷新的效果,代码如下

    $(".layui-icon-refresh").click();
    

    可在该页面任意地方使用,举个栗子,自动刷新代码如下

    let ref = null;
    $("#toggleRefresh").click(function () {
    	if (ref == null) {
    		ref = setInterval(function () {
    			$(".layui-icon-refresh").click();
    		}, 2000);
    	} else {
    		clearInterval(ref);
    		ref = null;
    	}
    });
    

    上述代码绑定至一个按钮即可实现开关自动刷新功能

    展开全文
  • 1、layui的环境搭建非常简单,跟query差不多。只要引入尽可以直接使用。1.1:引入js和样式2、如果做完整的前后天交互请求,则需要搭建响应的后台环境。(本次不介绍后台环境的搭建)第二步:下载layui。网址:...

    第一步:搭建环境。

    1、layui的环境搭建非常简单,跟query差不多。只要引入尽可以直接使用。

    1.1:引入js和样式

    2、如果做完整的前后天交互请求,则需要搭建响应的后台环境。(本次不介绍后台环境的搭建)

    第二步:下载layui。

    网址:https://www.layui.com/

    1、第一步打开layui下载网址

    2、下载layui的依赖包

    3、查看依赖包。

    相关推荐:《layui框架教程》

    第三步:代码实现。

    1、html代码部分的实现

    人员数据

    查看

    编辑

    删除

    2、js代码的实现。

    layui.config({

    version: '1545041465443' //为了更新 js 缓存,可忽略

    });

    layui.use(['laydate', 'laypage', 'table', 'element'], function(){

    var laydate = layui.laydate //日期

    ,laypage = layui.laypage //分页

    ,table = layui.table //表格

    ,element = layui.element //元素操作

    //默认第一次初始化调用执行一个 table 实例

    var tableIns = table.render({

    elem: '#demo'

    ,height: 450

    ,url:'demo.json' //数据接口

    ,title: '用户表'

    ,page: true //开启分页

    ,toolbar: 'default' //开启工具栏,此处显示默认图标,可以自定义模板,详见文档

    ,totalRow: true //开启合计行

    ,cols: [[ //表头

    {type: 'checkbox', fixed: 'left'}

    ,{field: 'id', title: 'ID', width:80, sort: true, fixed: 'left'}

    ,{field: 'username', title: '菜品名称', width:105}

    ,{field: 'sex', title: '菜单类别', width: 105, sort: true}

    ,{field: 'city', title: '所属菜系', width:115, sort: true}

    ,{field: 'sign', title: '签名', width: 80, sort: true, totalRow: true}

    ,{field: 'experience', title: '积分', width: 85, sort: true, totalRow: true}

    ,{field: 'score', title: '评分', width: 100}

    ,{field: 'classify', title: '职业', width: 100}

    ,{field: 'wealth', title: '财富', width: 100}

    ,{fixed: 'right', width: 165, align:'center', toolbar: '#barDemo'}

    ]]

    });

    按钮或者js定时调用,查询按钮调用function callBack(){

    //第二次调用

    tableIns.reload({

    where: {'username':"user-0"}/设定异步数据接口的额外参数,任意设

    ,page: {

    curr: 1 //重新从第 1 页开始

    }

    });

    }

    });

    第四步:测试。

    1、打开页面数据表格展示成功。

    2、点击翻页按钮的页数,刷新表格

    3、调用layui的请求刷新页面。

    展开全文
  • //监听“刷新”按钮$("#refresh").on('click', function(){//只重载数据,不实现条件搜索的重载table.reload('demoId', {//demoId是table.render()中id属性的值,如果没有设置,//layui2.2.x版本之后默认自动设置为...
  • 解决layui数据表格table的横向滚动条显示问题加上这段样式代码就可以解决了:body{overflow-y: scroll;} /* 禁止刷新后出现横向滚动条 */ps:这个问题fly社区给出的解释是:table 列宽自适应出现横向滚动条的几率...
  • layui数据表格刷新当前分页

    千次阅读 2019-07-03 16:40:40
    1、第一种 2、第二种
  • layui表格刷新按钮

    千次阅读 2019-08-18 11:58:39
    前几天用layui给客户做东西,后面客户说需要表格刷新的功能,要一个刷新的按钮,用来刷新表格。 其他的框架都是有刷新表格的表格的图标的,layui居然没有。看了一下才发现,分页下面的“确定”按钮就是刷新按钮...
  • 背景笔者之前一直使用 ...出现的问题:1、使用 Layui 官方提供的 【转换静态表格】 方式初始化加载时报 id 找不到的错误(自己的锅)2、传递参数问题(姑且算是 Layui 官方的锅)笔者使用的 table 加载刷新方案有...
  • layui表格刷新分页中当前页 //#reload刷新按钮的id $("#reload").on('click',function(){ // policy是表格的id属性 table.reload('policy', { //方法渲染表格里的属性 ID page: { curr: $(".layui-laypage-em")....
  • 朋友刚刚来找我说,想要LayUI的数据表格定时刷新刷新之后能够停留在当前页面,但是在查询的时候表格又要从第一页开始。 一开始我是想着自动刷新就使用$.post()+定时器,当前页面的话,加个参数区分自动刷新与查询...
  • layui数据表格编辑完,刷新数据

    千次阅读 2020-04-20 11:44:48
    在用layui开发时,修改完表格数据后,表格没有显示我们修改完的数据。怎么办,只能去查看layui文档,终于看到了我想要的方法。如下图所示: 以下是我的方法级渲染:而上图中的username就是要对应我们方法级渲染的...
  • layui重载表格

    2020-05-18 13:49:59
    笔记本添加成功以后,点击弹出层右上角的叉号以后,页面自动刷新表格 主要的js代码 cancel:function(index,layero){ table.reload('demo', { page: { curr: 1 //重新从第 1 页开始 } }); ...
  • layui数据表格筛选或搜索(reload)刷新两遍的问题 今天我又遇到了一个问题,layui的数据表格reload时刷新两遍的问题。 原因:由于筛选器使用的是 form ,因此如果使用 button type=“submit” 或者<input type=...
  • 笔者之前一直使用 bootstrap...出现的问题:1、使用 Layui 官方提供的 【转换静态表格】 方式初始化加载时报 id 找不到的错误(自己的锅)2、传递参数问题(姑且算是 Layui 官方的锅)(自己的锅)笔者使用的 table 加载刷...
  • 情况:自定义一个刷新按钮,点击后,使得表格刷新仍留在当前页 参考自:Layui官方文档的数据表格重载 二. 解决方案 这里只给出一种解决方案,由于渲染数据表格的方式不同,解决方案都会略有不同,但是都是大同小异,...
  • 模拟点击分页确定刷新数据 $(".layui-laypage-btn")[0].click() 转载于:https://www.cnblogs.com/objects/p/8358102.html
  • 打开页面时会调用一个查询方法,把数据赋值到数据表格上 ``` layui.use(['table','form','upload','layer'], function(){ var table = layui.table ...好像刷新表格又执行了查询全部的接口
  • Layui表格刷新(重载)

    千次阅读 2020-08-24 11:29:45
    一、表格刷新1、表格容器定义2、添加、编辑、删除 刷新1)、刷新时不保留搜索框的搜索信息2)、刷新时保留搜索框的搜索信息二、搜索按钮刷新1、搜索按钮2、刷新方式三、官方文档 一、表格刷新 1、表格容器定义 <...
  • 1、layui的环境搭建非常简单,跟query差不多。只要引入尽可以直接使用。1.1:引入js和样式2、如果做完整的前后天交互请求,则需要搭建响应的后台环境。(本次不介绍后台环境的搭建)第二步:下载layui。网址:...
  • 官方说明:https://www.layui.com/doc/modules/element.html#render 更新渲染 跟表单元素一样,很多时候你的页面元素可能是动态生成的,这时element的相关功能将不会对其有效,你必须手工执行 element.init(type,...
  • # 2:添加监听数据库回车、搜索“按钮”layui.use('table', function() {var table = layui.table;var isSearch = false;//输入框回车执行搜索$("#name").bind('keydown', function(event) {if (event.keyCode == ...

空空如也

空空如也

1 2 3 4 5 ... 12
收藏数 230
精华内容 92
关键字:

layui刷新表格