ValidationSugar表单验证框架的优点:

1、支持javascript端和后端的双重验证 (前端目前依赖于jquery.validate.js,也可以自已扩展)

2、代码简洁

3、调用方便

4、功能齐全

使用方法:

新建初始化类,将所有需要验证的在该类进行初始化,语法相当简洁并且可以统一管理,写完这个类你的验证就完成了70%

函数介绍:

Add 默认类型(邮件、手机、qq等)

AddRegex 正则验证 在Add无法满足情部下使用

addFunc 使用js函数进行验证,一般用于业逻辑的验证 ,功能非常强大,可以满足各种验证(注意:addFunc 函数验证后 后台需要重新验证,所以能用上两种方法验证的,尽量使用上面的)

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using SyntacticSugar; namespace ValidationSuarMVC.Models
{
public class Validates
{
public static void Init()
{ //login
ValidationSugar.Init(PageKeys.LOGIN_KEY,
ValidationSugar.CreateOptionItem().Set("userName", true/*是否必填*/, "用户名").AddRegex("[a-z,A-Z].*", "用户名必须以字母开头").AddRegex(".{5,15}", "长度为5-15字符").AddFunc("checkUserName", "用户名不存在,输入 admin1 试试").ToOptionItem(),
ValidationSugar.CreateOptionItem().Set("password", true, "密码").AddRegex("[0-9].*", "用户名必须以数字开头").AddRegex(".{5,15}", "长度为5-15字符").ToOptionItem()
); //register
ValidationSugar.Init(PageKeys.REGISTER_KEY,
ValidationSugar.CreateOptionItem().Set("userName", true, "用户名").AddRegex("[a-z,A-Z].*", "用户名必须以字母开头").AddRegex(".{5,15}", "长度为5-15字符").AddFunc("checkUserName", "用户名已存在!").ToOptionItem(),
ValidationSugar.CreateOptionItem().Set("password", true, "密码").AddRegex(".{5,15}", "长度为5-15字符").ToOptionItem(),
ValidationSugar.CreateOptionItem().Set("password2", true, "密码").AddRegex(".{5,15}", "长度为5-15字符").AddFunc("confirmPassword", "密码不一致").ToOptionItem(),
ValidationSugar.CreateOptionItem().Set("sex", true, "性别").AddRegex("0|1", "值不正确").ToOptionItem(),
ValidationSugar.CreateOptionItem().Set("email", true, "邮箱").Add(ValidationSugar.OptionItemType.Mail, "邮箱格式不正确").ToOptionItem(),
ValidationSugar.CreateOptionItem().Set("mobile", false, "手机").Add(ValidationSugar.OptionItemType.Mobile, "手机格式不正确").ToOptionItem(),
ValidationSugar.CreateOptionItem().Set("qq", false, "qq").AddRegex(@"\d{4,15}", "qq号码格式不正确").ToOptionItem(),
ValidationSugar.CreateOptionItem().Set("education", true, "学历", true/*checkbox 多选模式*/).AddRegex(@"\d{1,15}", "值不正确").ToOptionItem()
);
}
}
}

  

 

Global.cs注册我们就可以用了

验证大多情况下分两种

1、submit提交的写法

Register 一行代码搞定、获取绑定信息交给viewbag

PostRegister 也是一行完成后台验证

view

1、引用js并写好初始化函数

2、将@Html.Raw(ViewBag.validationBind) 放在页面最下方

VIEW完整代码:


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
@{
    ViewBag.Title = "Register";
    Layout = null;
}
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script src="/Content/jquery-validation-1.13.1/lib/jquery-1.9.1.js" type="text/javascript"></script>
    <script src="/Content/jquery-validation-1.13.1/dist/jquery.validate.js" type="text/javascript"></script>
    <script src="/Content/validation.sugar.js" type="text/javascript"></script>
    <script src="/Content/jquery-validation-1.13.1/lib/jquery.form.js" type="text/javascript"></script>
    <link href="/Content/jquery-validation-1.13.1/validation.sugar.css" rel="stylesheet"
        type="text/css" />
    <script type="text/javascript">
        $(function () {
            var factory = new validateFactory($("form"), "<img src=\"/Content/jquery-validation-1.13.1/error.png\" />");
            factory.init();
 
        });
 
        //用户名是否已存在
        function checkUserName() {
            //实际开发换成: ajax  async:false
            var userName = $("[name=userName]").val();
            if (userName == "admin1" || userName == "admin2") {
                return false;
            }
            return true;
        }
 
        //验证密码是否一致
        function confirmPassword() {
            return $("[name=password]").val() == $("[name=password2]").val();
        }
 
    </script>
    <style>
        td
        {
            height: 30px;
            padding: 5px;
        }
    </style>
</head>
<body>
    <h3>
        基于jquery.validate的前后台双验证</h3>
    <form method="post" class="form" id="form1" action="/home/postRegister">
    <table>
        <tr>
            <td>
                name
            </td>
            <td>
                <input type="text" name="userName">
            </td>
        </tr>
        <tr>
            <td>
                password
            </td>
            <td>
                <input type="password" name="password" />
            </td>
        </tr>
        <tr>
            <td>
                confirm password
            </td>
            <td>
                <input type="password" name="password2" />
            </td>
        </tr>
        <tr>
            <td>
                sex
            </td>
            <td>
                  <input type="radio" value="1" name="sex" />
                    
                    <input type="radio" value="0" name="sex" />
                    
            </td>
        </tr>
        <tr>
            <td>
                email
            </td>
            <td>
                <input type="text" name="email" />
            </td>
        </tr>
        <tr>
            <td>
                mobile
            </td>
            <td>
                <input type="text" name="mobile" />
            </td>
        </tr>
        <tr>
            <td>
                qq
            </td>
            <td>
                <input type="text" name="qq" />
            </td>
        </tr>
        <tr>
            <td>
                education
            </td>
            <td>
                <p>
                    <input type="checkbox" value="1" name="education" />
                    本科
                    <input type="checkbox" value="2" name="education" />
                    幼儿园
                    <input type="checkbox" value="3" name="education" />
                    小学
                </p>
            </td>
        </tr>
    </table>
    <button type="submit">
        submit提交(禁掉浏览器JS进行测试)</button>
    @Html.Raw(ViewBag.validationBind)
    </form>
</body>
</html>
1
<br><br>

 

就这么几行代码就完了一个注册

效果如下:  

对css支持还是不错的可以。自已美化

2、ajax写法

把submit改成button,在写个事件搞定

DEMO下载:

http://git.oschina.net/sunkaixuan/ValidationSuarMVC

ValidationSugar表单验证框架-支持ASP.NET MVC ASP.NET WebFroM的更多相关文章

  1. [JavaWeb基础] 015.Struts2 表单验证框架

    在web开发的过程中,我们经常要用到一些填写表单的操作,我们一般都要在提交表单信息的时候对表单的内容进行验证,struts2给我们提供了简单的实现接口,让我们可以很容易的对表单进行验证.下面讲解下最传 ...

  2. JS表单验证插件(支持Ajax验证)

    自己编写了一个表单验证插件,支持ajax验证,使用起来很简单. 每个需要验证的表单元素下面有一个span标签,这个标签的class有一个valid表示需要验证,如果有nullable则表示可为空:ru ...

  3. 一个自己实现的js表单验证框架。

    经常要做一些表单验证的操作,每次都是用现成的框架,比如jquery,bootstrap等的验证插件,虽然也很强大,也很好用,可就是用起来需要引入许多js库,还有里面功能太多,感觉不太符合自己的需求.最 ...

  4. easyui 表单验证validatetype——支持自定义验证

    easyui 的validatebox()提供了自定义验证的方法,为此我把一些常用的数据验证汇总了一下,代码如下: 代码 Code highlighting produced by Actipro C ...

  5. 简单的js表单验证框架

    /** * 通常在我们的HTML页面表单中有大量的数据验证工作, * 免不了要写很多验证表单的js代码,这是一项非常繁琐 * 枯燥的工作.很多程序员也会经常遗漏这项工作.当然 * 一些JavaEE框架 ...

  6. 前端jquery validate表单验证框架的使用

    一.框架本身校验方法的扩展 建议写在页内用于扩展框架本身的一些校验方法, 使用频繁也可以直接在源码上修改 例如扩展手机号码的校验: /*手机号码验证扩展 最新的号码 mobile: class的表示 ...

  7. 如何优雅的使用 Angular 表单验证

    随便说说,这一节可以跳过 去年参加 ngChine 2018 杭州开发者大会的时候记得有人问我: Worktile 是什么时候开始使用 Angular 的,我说是今年(2018年) 3 月份开始在新模 ...

  8. angularjs表单验证checkbox

    angularjs中默认有表单验证的支持,见文末的refer 我想要验证至少要选择一个checkbox,否则就不能提交 但是checkbox貌似没有简单的方法,想来想去给出下面的解决方案 valida ...

  9. atittit.表单验证的实现方式以及原理本质以及选型以及自定义兼容easyui dsl规则的表单验证

    atittit.表单验证的实现方式以及原理本质以及选型以及自定义兼容easyui dsl规则的表单验证 1. 需求,表单验证需要弹框式,但目前easyui ms绑定死了tooltip式样 1 2. 表 ...

随机推荐

  1. GBK、UTF8、UNICODE编码转换

    string GBKToUTF8(const std::string& strGBK) { , strGBK.c_str(), -, NULL, ); WCHAR * wszUTF8 = ne ...

  2. RESTful 接口规范

    原文地址:http://www.coderli.com/translate-restful-standard-resolved OneCoder最近一直在使用Restful API,最近正好看到一篇自 ...

  3. 奇怪吸引子---Rucklidge

    奇怪吸引子是混沌学的重要组成理论,用于演化过程的终极状态,具有如下特征:终极性.稳定性.吸引性.吸引子是一个数学概念,描写运动的收敛类型.它是指这样的一个集合,当时间趋于无穷大时,在任何一个有界集上出 ...

  4. [Aaronyang] 写给自己的WPF4.5 笔记19[Visual类图文并茂讲解]

    文章虽小,内容还好,且看且珍惜. aaronyang版权所有,不许转载,违者必究 当界面上使用数千个矢量图形,例如实时统计图,粒子碰撞,比如超级玛丽游戏,图像一直在绘,过量的使用WPF的元素系统和Sh ...

  5. Scala 深入浅出实战经典 第43讲:主要介绍类型变量bound

    王家林亲授<DT大数据梦工厂>大数据实战视频 Scala 深入浅出实战经典(1-64讲)完整视频.PPT.代码下载:百度云盘:http://pan.baidu.com/s/1c0noOt6 ...

  6. 表单验证Jquery扩展方法类

    /** 表单数据验证 **/ $.fn.Validform = function () { var Validatemsg = ""; var Validateflag = tru ...

  7. 不停止MySQL服务增加从库的两种方式

    不停止MySQL服务增加从库的两种方式 转载自:http://lizhenliang.blog.51cto.com/7876557/1669829 现在生产环境MySQL数据库是一主一从,由于业务量访 ...

  8. Cocos2dx使用wxsqlite开源加密SQLite3数据库

    最近使用wxsqlite加密sqlite3数据库,刚开始折腾好几天,在xcode上一直编译不通过,后来在sqlite3.c找到配置,编译顺利通过,太激动了,哈哈,废话少说!总结一下android和io ...

  9. tomcat java.net.BindException: Cannot assign requested address 解决方法

    今天线上TOMCAT启动时遇到了下比较麻烦的问题,错误如下: 21-Apr-2016 15:14:19.077 SEVERE [main] org.apache.catalina.core.Stand ...

  10. 防抖(Debounce)与节流( throttle)区别

    http://www.cnblogs.com/ShadowLoki/p/3712048.html http://blog.csdn.net/tina_ttl/article/details/51830 ...