Javascript表单验证框架：请求审核 [英] Javascript form-validation framework: Request for Review

问题描述

我不确定我是否可以提出这样的问题，但看到这个，看起来这种问题还可以。好吧，关于我的问题：

I wasn't sure if I could ask this kind of question, but after seeing this on Meta Stackoverflow, it looks like this kind of question is ok. Well, onto my question:

几个月前，我在Javascript中编写了一个验证框架。我知道已经存在验证框架，如 jQuery Validation ，但我想要采用不同的方法进行验证。当前的方法涉及编写Javascript代码以对表单元素执行验证。通过查看表单源代码，不会立即明确在每个元素上进行验证。在某种程度上，这可以通过使用指定不同类型的验证的CSS类来解决。但我觉得即使这样也是有限的，因为你无法轻松定制验证的行为（错误消息等）。我希望使用 JSR-303 Bean验证在Java中执行基于注释的验证。或 Hibernate Validator 。

A few months ago I wrote a validation framework in Javascript. I know that there already exist validation frameworks like jQuery Validation, but I wanted to take a different approach to validation. Current approaches deal with writing Javascript code to perform validation on form elements. By looking at the form source code, it is not immediately evident what validation occurs on each element. To some extent this can be remedied by using CSS classes that specify different kinds of validation. But I felt that even this was limited because you cannot easily customize the behavior of the validaton (error messages, etc.). I wanted to do something like annotation-based validation in Java using JSR-303 Bean Validation or Hibernate Validator.

由于HTML5允许您向元素添加自定义属性，我想我可以利用它来注释表单元素进行验证。所以，基本上，我想出了这个：

Since HTML5 allows you to add custom attributes to an elements, I figured that I could leverage this to "annotate" form elements for validation. So, essentially, I came up with this:

<input id = "myInput"
       name = "myInput"
       type = "text"
       class = "regula-validation"
       data-constraints = '@NotEmpty @IsNumeric @Between(min=1, max=5)' />

考虑到这个基本想法，我创建了一个Javascript框架：

With this basic idea in mind, I created a Javascript framework that:

• 检查已定义约束的元素的DOM并将这些约束绑定到元素


• 允许创建自定义约束


• 允许编程绑定约束


• 验证绑定约束

• Examines the DOM for elements that have constraints defined and binds these constraints to the elements
• Allows the creation of custom constraints
• Allows programmatic binding of constraints
• Validates bound constraints

此外，该框架具有以下功能：

In addition, the framework has the following features:

• 验证组，类似于JSR-303
$ b中指定的验证组$ b
• 错误消息的插值

• Validation groups, similar to that specified in JSR-303
• Interpolation for error messages

一旦我创建了我的框架，我就试图获得反馈并对其进行审核但我不是确定去哪里获得反馈和评论。我写了一些关于它的博客文章并将其发布到Digg和Reddit（编程部分），没有太多运气。有些人似乎对此感兴趣，但我没有得到更多。

Once I created my framework I tried to get feedback and review for it but I wasn't sure where to go to get feedback and review. I wrote a few blog posts about it and posted it to Digg and Reddit (programming section) without much luck. A few people seemed interested, but I didn't get much more than that.

最近，在我的工作场所，我们一直在对遗留代码库（JSP和servlet）进行现代化改造并将其移动到Spring MVC中。当验证对话出现时，我将我的框架投给了我的高级架构师。我做了一点整合和概念验证，他们似乎很感兴趣，并让我继续将它添加到项目中。直到现在，我只有自己的拙见，这将是一种有用的验证方式，所以这让我有信心我的想法和框架可能有一些优点。但是，我仍然需要更多的参与和框架。在我发现Stackoverflow确实允许这些问题之后，我决定将其发布在这里以获得一些建设性的批评，评论和反馈。

Recently, at my workplace we've been modernizing a legacy codebase (JSP and servlets) and moving it into Spring MVC. When the conversation of validation came up, I pitched my framework to my senior architect. I did a little integration and proof of concept and they seemed interested and gave me the go-ahead to add it to the project. Till now, I only had my own humble opinion that this would be a helpful way to do validation, so this gave me some confidence that my idea and framework might have some merit. However, I still needed some more participation and framework. After I figured out that Stackoverflow does allow these kinds of questions, I decided to post it on here to get some constructive criticism, comments, and feedback.

所以没有更多延迟，我想介绍 Regula 。我提供的链接转到GitHub上的wiki，其中包含该框架的所有文档。您可以从此处下载最新版本（v1.1.0）。

So without any more delay, I'd like to introduce Regula. The link I have provided goes to a wiki on GitHub that has all the documentation for the framework. You can download the latest version (v1.1.0) from here.

期待您的评论。

一些不直接相关的额外信息

我曾经想过将我的框架与Spring集成，即将bean上的验证注释转换为客户端验证。最近我能够使这个工作，即使有验证组（虽然目前没有支持客户端组之间的继承关系）。这样，您只需使用验证约束来注释字段属性，并自动生成客户端验证代码。但是，我是一个春天的新手，所以我的方法可能不那么干净。我想得到一些反馈，所以如果有人有兴趣请告诉我。理想情况下（我希望我不会太自命）我想联系春天的人，看看他们是否对此感兴趣。

I had toyed with the idea of integrating my framework with Spring, i.e., translating the validation annotations on beans into client-side validation. Recently I was able to get this to work, even with validation groups (although there is no support currently for inheritance relations between the groups on the client side). This way, you simply have to annotate field properties with the validation constraints, and client-side validation-code is automatically generated. However, I am a Spring novice and so my method is probably not that clean. I would like to get some feedback on this as well, so if anyone is interested please let me know. Ideally (and I hope I am not being too pretentious) I would like to contact the Spring folks and see if they are interested in this.

推荐答案

我已经非常喜欢它了，它使我的html保持干净，并且构建自定义验证器的能力非常好。我添加的一件事是绑定验证和提交函数的简写，并将其包装为jQuery插件：

I like it a lot already, it keeps my html clean and the ability to build custom validators is great. One thing I added was a short hand for binding the validation and submit functions, and wrapped it up as a jQuery plugin:

if (jQuery) {
    (function($)
    {
        $.regula = function(formId, callback) 
        {
            regula.bind();

            $("#" + formId).submit(function() 
            {
                var validationResults = regula.validate();

                if (validationResults.length > 0)
                {
                    if (callback)
                        callback(validationResults);

                    return false;
                }

                return true;
            });
        };
    })(jQuery);
}

事实上，我只是博客关于它，因为我对它的清洁和简单印象深刻。我仍然会花时间浏览你的资源，看看你是如何完成它的，但它是一个很好的开始：）

Infact, I've just blogged about it to as I am that impressed with how clean and easy it is. I'm still going to spend time going through your source, to see how your accomplished it, but its a great start :)

关于集成你的框架，我主要使用ASP.NET MVC，看看它如何将服务器端验证逻辑转换为客户端约束将会很有趣。我可能会在接下来的一个月左右看一下。

In regards to integrating your framework, I work mostly with ASP.NET MVC, and it would be interesting to see how it translate server-side validation logic into client-side constraints. Something I might look over in the next month or so.

这篇关于Javascript表单验证框架：请求审核的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！