在日常开发过程中为了减少与后台服务器的交互次数,大部分的功能都会放到前台使用JS来完成。

例如:一个表中有ID(FOCUS_SEQ)和Name(COLUMNCTRL)两个字段,其中ID是自定义连续增长的数字,Name是不同的字符串,表中的数据假设就只有八条,不会新增也不会删除。类似如下;

现在要写一个方法,方法的功能:要求输入一个Name的值并返回这个Name对应下一个Name的值:

要实现这个方法的思路是要将输入的Name值作为参数在这个表中查询出对应的ID,再将ID+1作为参数在这个表查询出对应的Name的值;

SQL: select Name from Table_Name where ID=(select ID from Table_Namewhere Name=@Name)+1

这个思路看似是实现了方法,但是写在后台每次执行方法的时候都会执行这句SQL语句与服务器数据库进行交互加大了服务器的压力并且也会造成页面刷新给用户带来不好的体验。

若在前台JS端使用AJAX调用一般处理程序是解决了会刷新页面的问题,但是每次调用的时候还是会执行SQL语句与数据库进行交互。

那么既然表中的ID是自定义连续增长的数字,数据也不会轻易的修改那能否在第一次执行这个方法的时候就将这张表中的数据全部查询出来保存在页面中,在后续再次调用方法时就不用从数据库中查询了,直接从保存的数据中获取到下一个Name的值?

SQL:select Name from Table_Name Order by ID(将数据根据ID进行排序全部查询带出)

依照这个思路,我将数据在第一次调用方法时就全部查询出来并绑定到页面上的一个GridView中(可以将GridView控件在页面中隐藏,仅保存数据使用)

那么就要使用JS代码来遍历GridView中的数据来与传入的Name值判断是否相等,若相等则在GridView中的Rows+1就是下一个Name的值。

//传入Name的值遍历GropView匹配获取下一个Name的值
function EnterScalar(COLUMNCTRL) {
var gdview = document.getElementById("GV_List");
if (gdview != null) {
for (var i = 1; i < gdview.rows.length; i++) { //遍历Table中的所有ROW
for (var j = 0; j < gdview.rows[i].cells.length; j++) { //遍历ROW的每一列
if (gdview.rows[i].cells[j].innerText == COLUMNCTRL) { //判断是否相等
alert(gdview.rows[i + 1].cells[j].innerText);
};
}
}
}
}

这样就完美的解决了程序与后台服务器和数据库交互次数过多以及页面会刷新的问题了。我可真是个小机灵哈哈哈~

前台JS遍历Table的所有单元格数据内容的更多相关文章

  1. JS遍历Table的所有单元格内容

    用JS去遍历Table的所有单元格中的内容,可以用如下JS代码实现: 这个方法的参数是唯一标识Table的id,用document对象的获取. function GetInfoFromTable(ta ...

  2. JS去遍历Table的所有单元格中的内容

    用JS去遍历Table的所有单元格中的内容,可以用如下JS代码实现 function GetInfoFromTable(tableid) { var tableInfo = ""; ...

  3. 使用js合并table中的单元格

    用primefaces做的报表,领导要求合并相同内容的单元格,但是primefaces没有找到可以合并单元格的组件,想来想去,只有页面加载后用js合并了. http://blog.csdn.net/d ...

  4. JS获取table表格任意单元格值

    jsp页面表格布局 <body onload="show()"> <center> <input type="text" valu ...

  5. jquery遍历table获取td单元格的值

    $("#grd").find("tr").each(function () { //第二列单元格的值eq(索引) alert($(this).children( ...

  6. JS遍历表格获取每行数据及每个单元格数据

    /** * 遍历表格获取每行数据及每个单元格数据 * @param tableID 表格ID */ function GetTable(tableID) { var milasUrl = {};//新 ...

  7. js遍历table 和 jquery 遍历table

    <span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255) ...

  8. js遍历table中的每一个元素

    function GetInfoFromTable(tableid) { var tableInfo = ""; var tableObj = document.getElemen ...

  9. CSS实现table固定宽度,超过单元格部分内容省略

    <table>单元格的宽度是根据内容的大小自适应的,没有内容的地方就挤到了一起.需要固定表格宽度和每一列的宽度. table-layout:fixed 在固定表格布局中,水平布局仅取决于表 ...

随机推荐

  1. LA3213加密

    题意:       白书上有些题的题意说的太蛋疼了,这个题的意思是说有两种加密方式,一种是交换位置,另一种是一一映射,交换位置是指如ABCD 可以加密成DCBA 也可以加密成ACBD就是把某些字母的位 ...

  2. Docker用Commit给容器做快照

    关于 commit 镜像是容器的基础,每次执行 docker run 的时候都会指定哪个镜像作为容器运行的基础. 镜像是多层存储,每一层是在前一层的基础上进行修改:而容器同样也是多层存储,是在以镜像为 ...

  3. IDEA 导入Springboot 项目:

    更多精彩关注公众号: IDEA 导入Springboot 项目: 1. 菜单->File->New->Project From Existing Sources 2. 选中项目中的p ...

  4. C#中的partial关键字

    这节讲一下partial(局部的,部分的)关键字,初学者可能没有接触过这个关键字,但是只要你写过winform或者WPF应用程序的话,那你肯定被动用过这个关键字.首先介绍一下这个关键字的作用,它用作定 ...

  5. .NET 平台系列6 .NET Core 发展历程

    系列目录     [已更新最新开发文章,点击查看详细] 在我的上一篇博客<.NET平台系列5 .NET Core 简介>中主要介绍了.NETCore的基本情况,主要包括.NET跨平台的缘由 ...

  6. MySQL8.0大表秒加字段,是真的吗?

    前言: 很早就听说 MySQL8.0 支持快速加列,可以实现大表秒级加字段.笔者自己本地也有8.0环境,但一直未进行测试.本篇文章我们就一起来看下 MySQL8.0 快速加列到底要如何操作. 1.了解 ...

  7. 最优运输(Optimal Transfort):从理论到填补的应用

    目录 引言 1 背景 2 什么是最优运输? 3 基本概念 3.1 离散测度 (Discrete measures) 3.2 蒙日(Monge)问题 3.3 Kantorovich Relaxation ...

  8. Spring cloud 基础框架集成

    Spring cloud 基础框架集成 1. 注册中心 -eurekar 1. pom依赖 <?xml version="1.0" encoding="UTF-8& ...

  9. [bug] Python Virtualenv 安装失败:ERROR: Cannot uninstall 'filelock'.

    参考 https://my.oschina.net/gain/blog/4333100

  10. Zabbix 监控系统部署

    Zabbix 监控系统部署 实验环境 Zabbix server:RHEL8 ip:192.168.121.10 一.关闭防火墙和selinux [root@Zabbix-server ~]# sys ...