上篇介绍了自写js判断的前三项,本篇博客介绍第四步,关于触发课程代码文本框的离开事件后,判断一整列的课程代码之间是否有重复的值。

  此问题可以提取为判断一个数组里是否有重复值,重复值是什么。

 第四步→判断界面唯一性,获取各行code值。

  通过观察,主从表下每一行的课程代码文本框都有一个数组样式的name属性,如:name="courseList[#index#].code" 

  查看代码可知,每一行的课程代码都有不同的name,那么怎么获取这些不同name的对象数组呢?

  

  通过反复试验,我最后得出一种方法,步骤是:先获得主从表内所有标签为<input>的对象,然后通过获取他们的name属性的值,来匹配。

  具体匹配方法就是观察各个name之间的不同。

  课程代码对应的name类型为:name="courseList[#index#].code" 

  课程名称对应的name类型为:name="courseList[#index#].name" 

  所以,通过观察,只要匹配code字符串就可以获取到一列的课程代码的对象数组了。

  拿到这个数组,就开始遍历,是否数组内有重复值,如果有重复值,就把它放在第三方的数组里,最后弹出框里显示这些重复值。

  具体的js代码如下:

  

   //4、判断界面唯一性,获取各行code值

             //4.1获得code列
//4.11获得表格
var table = document.all("parentTable");
//4.12获得表格下的所有文本框
var input=table.getElementsByTagName("input");
//4.13定义一个空数组来装得到的code列
var resultCodeString=[];
//4.14循环遍历出code列,并将code文本框的值放到定义的空数组resultCodeString中
for(i=0;i<input.length;i++){
//利用lastIndexOf来匹配,如果有code字符串则返回大于-1的值,
if(input[i].name.lastIndexOf("code")>-1){
//alert(input[i].value);
//如果name中匹配到了code,则将这个文本框的值放到我们的code数组里。
resultCodeString[resultCodeString.length] =input[i].value; }
}
//测试数组容器的长度
//alert(resultCodeString.length);
//定义一个第三方数组,来装重复值
var showMessage=[];
//遍历得到的code数组容器
for(i=0;i<resultCodeString.length;i++){
//测试是否是code列中的值
//alert(resultCodeString[i]);
//以下为判断是否重复的方法,并将重复值放在数组里。
//先排序
var resultCode=resultCodeString.sort();
for(var i=0;i<resultCodeString.length;i++){
if(resultCodeString[i] != ""){
if (resultCode[i]==resultCode[i+1]){
showMessage[showMessage.length] =resultCode[i];
}
} }
// alert(showMessage.length);
// alert("数组重复内容为:"+showMessage[i]); //因为我们得到的重复数据会有重复的,所以需要数组去重,这里调用了unique方法,具体实现见下面的代码
var arr=showMessage.unique();
if(arr!=""){
// alert("课程代码有重复,重复值为"+arr);
alertMsg.warn( "课程代码有重复,重复值为"+arr);
} }

  JS实现得数组去重的三种方法:借鉴于《三种常用的js数组去重方法》

  

 /* 第一种去重的方法 */
/* Array.prototype.unique = function(){
var res = [this[0]];
for(var i = 1; i < this.length; i++){
var repeat = false;
for(var j = 0; j < res.length; j++){
if(this[i] == res[j]){
repeat = true;
break;
}
}
if(!repeat){
res.push(this[i]);
}
}
return res;
} */
/* 第二种去重的方法 */
/* Array.prototype.unique = function(){
this.sort(); //先排序
var res = [this[0]];
for(var i = 1; i < this.length; i++){
if(this[i] !== res[res.length - 1]){
res.push(this[i]);
}
}
return res;
} */
/* 第三种去重的方法 */
Array.prototype.unique = function(){
var res = [];
var json = {};
for(var i = 0; i < this.length; i++){
if(!json[this[i]]){
res.push(this[i]);
json[this[i]] = 1;
}
}
return res;
}

  最后效果显示:

  

  虽然已经触发了课程代码文本框来进行了验证,但是如果用户不看提示框,仍旧一意孤行,也不是办法,所以后台仍要对应的判断。具体后台怎么进行判断,请看下篇博客分析。

  

  

DWZ主从表界面唯一性验证(自写js)(二)的更多相关文章

  1. DWZ主从表界面唯一性验证(自写js)(一)

    最近在项目中遇到一个问题,它的需求是: 利用DWZ的主从表结构批量添加课程信息,需要在触发课程代码文本框的离开事件时验证: 1.是否选择学院. 2.数据库里是否已存在该课程代码. 3.多条数据添加时, ...

  2. DWZ主从表界面唯一性验证(后台验证)(三)

    之前的博客介绍了前台自写js来验证主动表的唯一性,除了前台的验证,我也学习了后台的一些判断. 再次介绍一下背景需求: 利用DWZ的主从表结构批量添加课程信息,在提交表单后,触发Action事件 1.是 ...

  3. 代码生成工具Database2Sharp中增加视图的代码生成以及主从表界面生成功能

    在代码生成工具的各种功能规划中,我们一向以客户的需求作为驱动,因此也会根据需要增加一些特殊的功能或者处理.在实际的开发中,虽然我们一般以具体的表进行具体业务开发,但是有些客户提出有时候视图开发也是很常 ...

  4. Winform界面中主从表编辑界面的快速处理

    在Winform开发中,我们往往除了常规的单表信息录入外,有时候设计到多个主从表的数据显示.编辑等界面,单表的信息一般就是控件和对象实体一一对应,然后调用API保存即可,主从表就需要另外特殊处理,本随 ...

  5. Laravel 更新数据时在表单请求验证中排除自己,检查指定字段唯一性

    原文地址:https://moell.cn/article/24 不错的laravel网站 需求场景 修改用户信息时,在表单请求验证中排除当前邮箱所在的记录行,并检查邮箱的唯一性. Laravel版本 ...

  6. Winform开发框架之单据窗体生成(主从表,流水单号)

    源码地址:https://github.com/GarsonZhang/GZFramework.ShareDemo 前言 1.在开始本节前请先重置代码为 chapter-03-start 懒人地址:h ...

  7. Asp.Net MVC +EntityFramework主从表新增编辑操作的实现(删除操作怎么实现?)

    Asp.Net MVC +EntityFramework主从表新增编辑操作的实现 对于MVC中同时对主从表的表单操作在网上现有的解决很少,而这样的操作在做业务系统中是经常为遇到的.我在网上搜索了很久都 ...

  8. DataSnap ClientdataSet 三层中主从表的操作

    非原创  摘自:http://hi.baidu.com/yagzh2000/blog/item/fc69df2cb9845de78b139946.html三层中主从表的操作(删除.新增.修改)一定要在 ...

  9. HTML5表单及其验证

    随笔- 15 文章- 1 评论- 115 HTML5表单及其验证   HTML表单一直都是Web的核心技术之一,有了它我们才能在Web上进行各种各样的应用.HTML5 Forms新增了许多新控件及其A ...

随机推荐

  1. Android开发(七)——判断网络状态

    项目中难免会出现使用网络的情况,使用网络前得进行网络判断,看网上的网友一般有多种实现版本. 第一种: // 是否有网络连接 public static boolean isNetworkConnect ...

  2. vpnbook.py

    vpnbook提供免费的vpn服务,当然了,免费的肯定有限制,vpnbook的限制在于速度,一般只有10kb/s左右,用来看看网页还可以,当主力就不够了. 话说IE存在的意义就是用来下载其它浏览器,我 ...

  3. 在SQL Server中创建用户角色及授权

    参考文献 http://database.51cto.com/art/201009/224075.htm 正文 要想成功访问 SQL Server 数据库中的数据, 我们需要两个方面的授权: 获得准许 ...

  4. RRDtool运用

    一 建立RRD数据库(.rrd文件) $ rrdtool RRDtool Copyright - by Tobias Oetiker <tobi@oetiker.ch> Compiled ...

  5. 【微信小程序】tabBar的显示问题

    tabBar不显示 在app.json中配置了4个页面,在tabBar的list中随意写了两个页面,编译后发现不能显示tabBar. { "pages": [ "page ...

  6. win 安装pip和requests

    下载地址是:https://pypi.python.org/pypi/pip#downloads : 下载完成之后,解压到一个文件夹,用CMD控制台进入解压目录,输入: python setup.py ...

  7. <悟道一位IT高管20年的职场心经>笔记

    1. 你一定会在某个时候惊讶地发现,原来当初你曾经硬着头皮挨过来的日子对你是那么的珍贵.2. "'老板就是老板'.这一点,你可能会忘,他一定不会忘.'老板不会总是老板'.这一点,他可能会忘, ...

  8. Postgres快速创建大量测试数据

    DROP TABLE IF EXISTS color; CREATE TABLE color( cname ), remark ) ); ),) ,); 插入10000000数据之后,用时51秒 对于 ...

  9. Linxu Yum方式安装Mysql

    1.下载yum源 进入http://dev.mysql.com/downloads/repo/,下载RedHat Enterprise Linux 6 / Oracle Linux 6版.文件名称:m ...

  10. Java 原码 反码 补码

    本篇文章讲解了计算机的原码, 反码和补码. 并且进行了深入探求了为何要使用反码和补码, 以及更进一步的论证了为何可以用反码, 补码的加法计算原码的减法. 论证部分如有不对的地方请各位牛人帮忙指正! 希 ...