C# 结合 JavaScript 对 Web 控件进行数据输入验证
目录
关于数据验证
范例运行环境
验证设计
JavaScript 方法
设计
实现
调用示例
C# 方法
设计
实现
调用示例
小结
关于数据验证
在 Web 应用的录入界面,数据验证是一项重要的实现功能,数据验证是指确认 Web 控件输入或选择的数据,是否满足数据表数据约束,是否满足应用程序所需要数据约束规则。建立数据库约束可以满足数据验证的应用,但在实际的应用中,我们建议还是在更新信息到数据库前,在应用中执行数据验证,这样可减少错误录入,减少应用程序与数据库之间频繁通信造成的服务器压力。通过有效的数据验证,可以确认写入数据表中的数据是有效且符合预期的。本文我们将介绍如何通过C# 后端及JavaScript 前端对 Web 控件进行数据输入有效性的验证。
范例运行环境
操作系统: Windows Server 2019 DataCenter
.net版本: .netFramework4.7.1 或以上
开发工具:VS2019 C#
验证设计
通过对 Web 服务器控件捆绑自定义属性 checkSchema="" 和 cName="",将自定义的校验类型和中文提示进行赋值,即可完成验证的设置,可实现的校验类型如下图所示:
多个数据校验类型请用“|”进行分隔,如下设计举例:
示例 1:不能为空且必须为日期型数据
示例 2:必须为身份证号
示例3:必须输入4位的一个整型数
JavaScript 方法
设计
在前端客户端,使用 JavaScript 方法 simplecheck 进行数据验证,验证通过反回 true,否则为 false,其参数说明如下表:
序号 | 参数名 | 类型 | 说明 |
---|---|---|---|
1 | chkobj | dom元素对象 | 如传递一个 input type="text" 的对象 |
2 | _chkvalue | 字符串值 | dom元素对象的值,如 value 属性值 |
3 | allowAlert | 布尔值 | 当验证错误时是否允许弹出alert提示框,true为允许 |
4 | etip | 字符串值 | 附加的前缀提示信息,后缀为方法提供的定义的错误提示信息 |
实现
simplecheck 方法完整代码如下:
function simplecheck(chkobj, _chkvalue, allowAlert,etip) { check_result = true; check_errid = ''; check_errmsg = '';var _checkSchema = chkobj.getAttribute('checkSchema');var _cName = chkobj.getAttribute('cName'); if (_checkSchema.indexOf('ctrim') != -1) { _chkvalue = ctrim(_chkvalue); } var _objlength = _chkvalue.length; if (_checkSchema.indexOf('abslen') != -1) { _objlength = PositionLen(_chkvalue); } var _schemaList = _checkSchema.split('|'); var _reqeustnotnull = false; for (var k = 0; k =0的正数,请核对!'; break; case curSchema == 'snumber': check_result = isSNumber(_chkvalue); curErrmsg = _cName + ' 输入的数值应为