今天在Layui官网拿了一个table表格数据展示的源码,研究遇到了很多问题,最后才把数据展示出来,和大家分享下。

源码地址:https://www.layui.com/demo/table/operate.html

下面图片是做出来展示数据的效果

说下遇到的问题:

1.去Layui官网下载框架文件,解压后必须完整的放到项目里然后引用文件,注意必须完整。

2.

这个url链接的地址:是你项目目录下的具体方法,这个方法经测试返回了Layui要求的JSON格式数据

上面的截图里面有一个json.ToJson_LayUI()的方法,这是将数据转换成Layui所需要的JSON格式数据,为了方便不截图了,贴代码如下:

Public Function ToJson_LayUI(ByVal ds As DataSet) As String
'Dim jsonString As String = "{""total"":" & ds.Tables(0).Rows.Count.ToString & ","
Dim jsonString As String = "{""code"":0,""msg"":"""",""count"":" & ds.Tables(0).Rows.Count.ToString & ","
Dim table As DataTable
For Each table In ds.Tables
jsonString += """data"":" + ToJson(table) + ","
Next
jsonString = jsonString.TrimEnd(",")
Return jsonString + "}"
End Function

Public Function ToJson(ByVal dt As DataTable) As String
Dim jsonString As System.Text.StringBuilder = New System.Text.StringBuilder()
jsonString.Append("[")
Dim drc As DataRowCollection = dt.Rows
Dim i As Integer = 0
For i = 0 To drc.Count - 1
jsonString.Append("{")
Dim j As Integer = 0
For j = 0 To dt.Columns.Count - 1
Dim strKey As String = dt.Columns(j).ColumnName
Dim strValue As String = drc(i)(j).ToString()
Dim type As Type = dt.Columns(j).DataType
jsonString.Append("""" + strKey + """:")
strValue = StringFormat(strValue, type)
If (j < dt.Columns.Count - 1) Then
jsonString.Append(strValue + ",")
Else
jsonString.Append(strValue)
End If
Next
jsonString.Append("},")
Next
If jsonString.ToString <> "[" Then
jsonString.Remove(jsonString.Length - 1, 1)
End If
jsonString.Append("]")

Return jsonString.ToString()
End Function

这两个方法把数据转换成JSON格式数据。

Layui使用table展示数据的更多相关文章

  1. Saiku Table展示数据合并bug修复(二十五)

    Saiku Table展示数据合并bug修复 Saiku以table的形式展示数据,如果点击了 非空的字段 按钮,则会自动进行数据合并,为空的数据行以及数据列都会自动隐藏掉. 首先我们应该定位问题: ...

  2. flask+layui+echarts实现前端动态图展示数据

    效果图: 该效果主要实现一个table展示数据,并在下方生成一个折线图. 实现方式: 1.首先需要对表格进行一个数据加载,这里用到了layui的table.render,具体用法可以参考 https: ...

  3. 使用LayUI展示数据

    LayUI是一款免费,开源,轻量级的前端cms框架,适用于企业后端,能快速上手开发,集成了常用的组件,还有完善的文档和社区. 点击查看 文档地址 下载框架 使用: 1.把这个5个文件项都拷贝到项目中 ...

  4. LayUI之table数据表格获取行、行高亮等相关操作

    前言 目前LayUI数据表格既美观有不乏一些实用功能.基本上表格应有的操作已经具备,LayUI作者[贤心]肯定是煞费苦心去优化,此处致敬.但是实话实话,如果单纯那数据表格功能来说,EasUI的数据表格 ...

  5. MySQL+Service+Servlet+Jsp实现Table表格分页展示数据

    下面以一个示例讲解如何使用MySQL+Service+Servlet+Jsp实现Table表格分页展示数据: eg:请假管理系统 要求如下: 一.打开首页页面, 访问查询请假记录的 servlet , ...

  6. 基于 若依 ,或者使用 LayUi ,用来展示数据表,同时要 转换字典数据时的转换的建议

    原作者在做这个项目时,他把所有数据字典都放在数据库表中了,这种方法的确比较好,适用于中大型项目,方便统一管理字典:而且优点突出,字典值变化后不需要调整前端代码: 但是在实际开发项目中,一些小型的项目, ...

  7. 分享layui的table的一些小技巧,前端分页

    最近一直在折腾报表,期间使用了layui的table做展示(版本号:2.5.5) 起初:以为是查询结果出来后,前端和服务端分页一弄就完事了,参考例子,但是sql写得太长太长了,翻页困难,数据库是老旧的 ...

  8. 创建几个常用table展示方式插件

    这次和大家分享的是自己写的一个table常用几种展示格式的js插件取名为(table-shenniu),样式使用的是bootstrap.min.css,还需要引用jquery.min.js包,这个插件 ...

  9. Repeater控件 ---表格展示数据

    简介: Repeater控件是Web 服务器控件中的一个容器控件,它使您可以从页的任何可用数据中创建出自定义列表. Repeater 控件不具备内置的呈现功能,这表示用户必须通过创建模板为 Repea ...

随机推荐

  1. 新装 Win7 系统装完驱动精灵,一打开到检测界面就卡死——原因与解决方案

    1.现象: 重装系统后,鼠标反应慢,且不能上网.因此装了个驱动精灵,准备更新下驱动,但驱动精灵一打开到检测界面就卡死(换驱动人生.鲁大师也一样). 2.原因: Win7 系统 iso 中自带的驱动程序 ...

  2. css 效果之转换

    在css3 中,有一个转换效果,也可以替代js,并且比 js 做得好,那就是转换,即transform 属性,只需要个这个属性加上值,就可以实现转化效果了;有三种值,平移(translate),旋转( ...

  3. Spark sql 在yarn-cluster模式下找不到表

    在hive里建一个数据库test,在数据库里建了一张表user,然后在Spark程序中使用Spark sql读取这张表 "select * form test.user" 当部署模 ...

  4. gitkraken clone报错 Configured SSH key is invalid

    gitkraken clone远程仓库时报错 Configured SSH key is invalid. Please confirm that is properly associated wit ...

  5. logging-----日志模块

    import logging #creat logger 第一步,创建一个记录器 logging_name = 'test' logger = logging.getLogger(logging_na ...

  6. jpa table主键生成策略

    用 table 来生成主键详解 它是在不影响性能情况下,通用性最强的 JPA 主键生成器.这种方法生成主键的策略可以适用于任何数据库,不必担心不同数据库不兼容造成的问题. initialValue不起 ...

  7. wsl ubuntu 配置c++环境

    1.sudo apt-get install  build-essential 更新 配置源 2.sudo apt install gcc-8 3.sudo apt install g++-8 cd ...

  8. cuts

    1.cuts .replacename.fasta..replacename.fasta..replacename.fasta.cut.list awk 'system("mv Dme49. ...

  9. 学生管理系统(javaweb版)

    准备用javaweb 的技术做一个简单的学生管理系统 打算不用登陆的那种,直接进入管理界面. 完成增删改查的功能. 慢慢开始更新,先写那么多.

  10. [Solution] 969. Pancake Sorting

    Difficulty: Medium Problem Given an array A, we can perform a pancake flip: We choose some positive ...