在日常开发过程中为了减少与后台服务器的交互次数,大部分的功能都会放到前台使用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. 针对缓冲区保护技术(ASLR)的一次初探

    0x01 前言 ASLR 是一种针对缓冲区溢出的安全保护技术,通过对堆.栈.共享库映射等线性区布局的随机化,通过增加攻击者预测目的地址的难度,防止攻击者直接定位攻击代码位置,达到阻止溢出攻击的目的的一 ...

  2. POJ2239简单二分匹配

    题意:       一周有7天,每天可以上12节课,现在给你每科课的上课时间,问你一周最多可以上几科课,一科课只要上一节就行了. 思路:       简单题目,直接二分就行了,好久没写二分匹配了,练习 ...

  3. Access denied for user '电脑用户名'@'localhost'

    之前没有碰到这个问题,但是这次从gitee上面拉取代码运行,发现存在bug 错误描述 java.sql.SQLException: Access denied for user '10134'@'lo ...

  4. Django(5)django配置信息

    前言 Django的配置文件settings.py用于配置整个网站的环境和功能,核心配置必须有项目路径.密钥配置.域名访问权限.App列表.中间件.资源文件.模板配置.数据库的连接方式 基本配置信息 ...

  5. 【Matlab】BFSK的调制与解调仿真

    写在前面 本篇是[Matlab]BASK的调制与解调仿真的下篇,考虑到阅读体验,故另开一篇分享将BFSK的调制与解调仿真. 索引 写在前面 一.BFSK的调制 1.1 异频载波生成 1.2 信号合并 ...

  6. 《Spring 手撸专栏》第 2 章:小试牛刀(让新手能懂),实现一个简单的Bean容器

    作者:小傅哥 博客:https://bugstack.cn 沉淀.分享.成长,让自己和他人都能有所收获! 一.前言 上学时,老师总说:不会你就问,但多数时候都不知道要问什么! 你总会在小傅哥的文章前言 ...

  7. golang:运算符总结

    算术运算符 运算符 示例 结果 + 10 + 5 15 - 10 - 5 5 * (除数不能为0) 10 * 5 50 / 10 / 5 2 % (除数不能为0) 10 % 3 1 ++ a = 0; ...

  8. [bug] maven“1.5不支持diamond运算符,请使用source 7或更高版本以启用diamond运算符”

    原因 maven打包默认采用jdk 1.5,无法识别<> 解决 在pom.xml中加入: <properties> <maven.compiler.source>1 ...

  9. [前端] JSON

    背景 JavaScript对象表示法(JavaScript Object Notation):是一种存储数据的方式 JSON对象 创建 var gareen = {"name":& ...

  10. vmware安装ubuntu ,一直处于end kernel panic - not syncing : corrupted stack end detected inside scheduler

    vmware安装ubuntu ,一直处于end kernel panic - not syncing : corrupted stack end detected inside scheduler y ...