精华内容
下载资源
问答
  • layui打印表格自定义函数

    千次阅读 2019-10-02 08:07:22
    h = window.open("打印窗口", "_blank" ); h.document.write(f + $(v).prop("outerHTML" )); h.document.close(); h.print(); h.close(); } 效果如下   转载于:...

    函数如下

    function print (tablelayid)
    {
        var v = document.createElement("div");
        var f = ["<head>", "<style>", "body{font-size: 12px; color: #666;}", "table{width: 100%; border-collapse: collapse; border-spacing: 0;}", "th,td{line-height: 20px; padding: 9px 15px; border: 1px solid #ccc; text-align: left; font-size: 12px; color: #666;}", "a{color: #666; text-decoration:none;}", "*.layui-hide{display: none}", "</style>", "</head>"].join("");
        $(v).append($(".layui-table-box").find(".layui-table-header").html());
        $(v).find("tr").after($("[lay-id=\"" + tablelayid+ "\"] .layui-table-body.layui-table-main table").html()); $(v).find("th.layui-table-patch").remove();
        $(v).find(".layui-table-col-special").remove();
        var h = window.open("打印窗口", "_blank");
        h.document.write(f + $(v).prop("outerHTML"));
        h.document.close();
        h.print();
        h.close();
    }

    效果如下

     

    转载于:https://www.cnblogs.com/bfyx/p/10058373.html

    展开全文
  • 记录:layui 打印table表格某一行数据 $('body').on('click', '.print_apple', function () { $(this).removeAttr("data-open"); //禁止打开弹窗页面 var thisHang = $(this).parent().parent().parent(); var ...

    记录:layui 打印table表格某一行数据

     $('body').on('click', '.print_apple', function () {
         $(this).removeAttr("data-open");    //禁止打开弹窗页面
         var thisHang = $(this).parent().parent().parent();
         var indexs = thisHang.attr('data-index');
         console.log(indexs);
         var tablelayid = 'currentTableRenderId';
         // hotelData = hotelData[0];    
         let hotelName = '入库任务';//酒店名称
         let businessDate = '2021-06-14';//营业日期
         let printer = '打印人';//打印人
         let printerTime = '2021-06-15';//打印时间
         let reportName = "打印某一行入库任务";
         let v = document.createElement("div");
         let f = [`<head><br><div style='text-align:center;font-size:25px;'>${hotelName}</div><div style='font-size:16px;'>${reportName}<br>营业日期:${businessDate}</div>`,
             "<style>", "body{font-size: 16px; color: #666;}", "table{width: 100%; border-collapse: collapse; border-spacing: 0;}",
             "th,td{line-height: 20px; padding: 9px 10px; border: 1px solid #ccc; text-align: center; font-size: 18px; color: #666;}",
             "a{color: #666; text-decoration:none;}", "*.layui-hide{display: none}",
             "</style>", "</head>"].join("");
         $(v).append($(".layui-table-box").find(".layui-table-header").html());
         $(v).find("tr").after($("[lay-id=\"" + tablelayid + "\"] .layui-table-body.layui-table-main table tr[data-index="+indexs+"]").html()); 
         $(v).find("th.layui-table-patch").remove();
         $(v).find(".layui-table-col-special").remove();
         //页脚展示打印人,打印时间
         let footer = [`<footer><div><div style='float: left;'>打印人:${printer}</div><div style='float: right;'>打印时间:${printerTime}</div></div></footer >`].join("");
         let h = window.open("打印窗口", "_blank");
         h.document.write(f + $(v).prop("outerHTML") + footer);
         h.document.close();
         h.print();
         h.close();
     });
    

    示例:
    在这里插入图片描述
    在这里插入图片描述

    展开全文
  • layui表格table选中数据后可打印本行数据,未打印时不显示,只在打印页面显示打印内容。只是做了一个简单的demo,页面需要自己去画,方法已实现。有具体的指导步骤
  • 把数据从layui数据表格中获取出来,其实非常简单只需要在layui数据表格里面加上一个done的属性就可以了,就可以拿到表格中的数据条数。 首先,done这个属性是自定义属性的意思,function中接收的参数是当前表格的...

    把数据从layui数据表格中获取出来,其实非常简单只需要在layui数据表格里面加上一个done的属性就可以了,就可以拿到表格中的数据条数。
    在这里插入图片描述
    首先,done这个属性是自定义属性的意思,function中接收的参数是当前表格的参数,count是当前表格的总条数,如下数据表格中有74条数据。
    在这里插入图片描述
    控制台打印如下也是74条数据
    在这里插入图片描述
    这些数据中存在金额所以我们要统计出所有金额,如下:。
    在这里插入图片描述
    我们可以直接在layui数据表格里面加上totalRow就可以totalRow是合计的意思,如下:

    在这里插入图片描述
    就可以计算出当前页面数据的总金额了,但是只能计算出当前页面的,页面显示10条数据就只能计算十条的总数,所以不是特别方便,还是需要我们去控制器中全部计算出来。

    展开全文
  • 在做这个功能的时候,我在后端打印的数据是没有经过解码的数据,像这样的:%5B%7B%22cId%22%3A%221%22%2C%22tId%22%3A1%2C%22inport%22%3A2%2C%22state%22%3A%22%22%2C%22householdNumber%22%3A66%2C%。所以在后端要...

    在做这个功能的时候,我在后端打印的数据是没有经过解码的数据,像这样的:%5B%7B%22cId%22%3A%221%22%2C%22tId%22%3A1%2C%22inport%22%3A2%2C%22state%22%3A%22%22%2C%22householdNumber%22%3A66%2C%。所以在后端要对传来的数据进行解编码。

     String excelData = URLDecoder.decode(data, "utf-8");

    这就是我在用layui第三方插件导入Excel数据到数据表格时遇到的问题。

    欢迎留言讨论

    展开全文
  • 修改静态的表格过后,搞个触发事件打印出table中的缓存,建议先打印table查看自己的table结构 不同的版本结构会不一样 我使用的是 var table; function tableData() { console.log(table.cache.JxDataTabel);//...
  • layui表格打印全部数据

    万次阅读 2019-01-16 16:09:04
  • layui数据表格工具栏隐藏某个按钮

    千次阅读 2020-10-21 16:35:06
    layui提供的工具栏toolbar十分便捷,但是我们或许不需要其中的某个按钮,因此layui也给我们提供了只显示某个按钮的方法efaultToolbar: [‘filter’, ‘print’, ‘exports’] 如下示例隐藏打印图标 ,toolbar: '#...
  • 今天在进行layUI表格渲染时,出现一个奇怪的现象,后台打印可以获取到对象的属性值,而前台页面却无法显示。再三核对属性名发现并没有错误。心中万分纠结!!! 后台打印: 前台渲染: 结果却出人意料,经过...
  • layui 数据表格按钮事件绑定和渲染

    千次阅读 2019-10-04 22:29:45
    顶部的添加和删除按钮,右侧的三个筛选,打印,导出按钮 基础参数属性:toolbar:'#demo2', //创建 删除 添加按钮模板 <!-- 生成模块 --> <script id="demo2" lay-filter="test1"> <button ...
  • 4、工具栏:筛选列、导出Excel、打印; 5、搜索功能; 6、后端排序功能; 本实例只展示了实现功能的必须代码,后端代码的非必须部分未贴出。 本实例默认读者是后端程序员,着重展示前端部分。 后端 前置技能 1、...
  • JS: var tableIns = table.render({ elem:'#test' ,url:'${ctx}/product/getProductsByPage' //数据接口 ,toolbar:'#toolbar... ,defaultToolbar:['filter','exports','print'] //排序,导出,打印 ,even...
  • layui 表格 获取所有数据

    万次阅读 2018-09-03 15:03:17
    版本2.2.6 中 使用 layui.table.cache.tablename 可以取到表格中所有数据 可以打印 console.log("data-----"+JSON.stringify(table.cache)); 看看
  • layui中如何获取表格全部数据?

    千次阅读 2020-10-14 17:03:31
    我们在使用layui的时候,想获取表格全部数据,那么如何获取尼?下面本篇文章给大家介绍一下layui中获取表格全部数据的方法。 layui中获取表格全部数据 第一步可以通过layui.table.cache["testReload"]的方式来...
  • 参考: table.render({ elem: "#test", // id: "table_cell_data", ... toolbar: "#toolbarDemo", //指向自定义工具栏模板选择器 defaultToolbar: [], //除去打印,导出 title: "用户数据表", col
  • image.png 表格加载完成时重新绑定lay事件 监听重新绑定的事件
  • 需求:layui的内置模块table的工具栏已经包含了打印功能,但只能简单打印表格数据。现需要在已有数据的情况下,再添加额外信息,并加以css美化。 待解决的问题:如何自定义打印页面 分析: table的打印按钮绑定了...
  •  <div class="layui-tab-item layui-show">      年龄1  身高  体重  疾病史      <td>61岁   <td>161cm  <td>61kg  高血压、糖尿病        <!--对应1-->  <div class="layui-tab-item">    ...
  • 最近蜂鸟速驾项目用layui框架,table进行表格渲染 控制台打印发现有数据,但是table.render渲染不出来,后来发现是数据已经返回但是页面元素未加载完成的缘故,用setTimeout定时器解决这个问题。代码如下 ...
  • layui+jQuery总结

    2021-04-02 15:19:41
    layui+jQuery基本原生技术要点 layui表格渲染 var table1 = table.render({ ...toolbar:true,(true有表头工具,可打印,可导出表格数据,false则没有) limits:gtSettings.table.limits,(每页展示多少条数据,可自定义) limi
  • 前端页面采用Layui进行搭建,数据处理用到了MyBatis框架,页面只有一个,所有的操作都在名为index.jsp上面,通过ajax技术来请求servlet来获取数据,返回的是json格式数据,会交给返问操作源来处理json数据最后渲染成...
  • 在使用springboot框架的前提下,前端layui,在控制器中使用@ResponseBody,将json字符串数据突然转换成了document文本类型,导致json数据直接打印在了前端页面,table表格渲染失败,请问各位大神,要想table渲染成功...
  • 在写layui数据表格时,发现中文乱码问题 如图 解决办法:加上produces @RequestMapping(value = "/item/list",produces="text/html;charset=utf-8") 效果: 上下页符号乱码 如图 解决办法:打印栏提示GET请求...
  • 最近使用layui table进行异步获取数据并填充的时候,控制台打印出数据长度为0,但是其中还有数据,网上找了很多办法,下边是我最后使用的。 一般,render渲染表格是独立的书写格式,但是我在做数据统计的时候,需要...
  • ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 开发工具与关键技术:VS 与layui ...数据打印到Excel表格之前,先查询和筛选。 数据导入到Excel表格有什么用呢?导入到表格又是怎么实现的...
  • 最近将一个.net项目迁移到java时,在前端使用Layui,jquery,h5框架,后端采用ssm框架,编辑平台为idea,所有的编码格式都设置为UTF-8,但是当我在前端查询一个中文名字时,如下如所示:传到后端的控制层后,打印出来...
  • 树形表格treeTable实现了layui数据表格的大部分功能,并且在用法上与几乎数据表格一致, 支持懒加载、复选框联动(半选)、拖拽列宽、固定表头等功能。 演示地址:https://whvse.gitee.io/treetable-lay/demo/ ...
  • 有一个按钮,id是search, 当点击按钮时,执行点击事件。 点击事件为,打印一个字符串和表格重载。 问题是:为什么code的名字变成了一个随机的字符串???哪位大神能告知?...
  • 首先看一下界面 ...关于勾选之后是传id数组还是传整个勾选的对象数组,先说结论: 应该传的是id数组而不是对象数组 原因如下: 1.... Excel表格下载到本地 4. 故 我们一般选择通过id数组传递数据

空空如也

空空如也

1 2
收藏数 36
精华内容 14
关键字:

layui打印表格