Javascript form-validation framework：Request for Review

我不確定我是否可以問這樣的問題，但在Meta Stackoverflow上看到this後，它看起來像這樣的問題是好的。那麼，在我的問題上：Javascript form-validation framework：Request for Review

幾個月前，我用Javascript寫了一個驗證框架。我知道已經存在像jQuery Validation這樣的驗證框架，但我想採用不同的方法進行驗證。目前的方法處理編寫Javascript代碼來對錶單元素進行驗證。通過查看錶單源代碼，不會立即明白在每個元素上發生了什麼驗證。在某種程度上，這可以通過使用指定不同類型驗證的CSS類來彌補。但是我覺得即使這樣做也是有限的，因爲你無法輕鬆定製validaton的行爲（錯誤消息等）。我想要使用基於註釋的Java驗證，使用JSR-303 Bean Validation或Hibernate Validator。

由於HTML5允許您爲元素添加自定義屬性，因此我認爲我可以利用這個「註釋」表單元素進行驗證。因此，從本質上講，我想出了這個：

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

有了這個基本的想法，我創建了一個JavaScript框架是：

檢查對於具有定義的約束元素的DOM，並結合這些約束於元件
允許定製約束創建
允許約束
void驗證約束的約束方案結合

此外，該架構具有以下特點：

確認團組，類似於指定JSR-303
插值錯誤信息

有一次，我建立了我的框架我試圖獲得反饋並對其進行檢查，但我不確定要去哪裏獲得反饋和評論。我寫了一些關於它的博客文章，並將其發佈到Digg和Reddit（編程部分），但沒有多少運氣。有幾個人似乎很感興趣，但我沒有得到更多。

最近，在我的工作場所，我們一直在對現有代碼庫（JSP和servlet）進行現代化，並將其轉移到Spring MVC中。當驗證對話出現時，我將我的框架交給我的高級架構師。我做了一點整合和概念驗證，他們似乎很感興趣，並且讓我繼續將其添加到項目中。到目前爲止，我只有自己的一個卑鄙的觀點，認爲這將是一種有效的驗證方式，所以這給了我一些信心，我的想法和框架可能有一些優點。但是，我仍然需要更多的參與和框架。在我發現Stackoverflow確實允許這些類型的問題後，我決定在這裏發佈它以獲得一些建設性的批評，評論和反饋。

所以不再拖延了，我想介紹一下Regula。我提供的鏈接轉到GitHub上的維基，該維基擁有該框架的所有文檔。您可以從here下載最新版本（v1.1.0）。

期待您的意見。

我曾與我的框架與Spring集成，即翻譯驗證註解豆成客戶端驗證的想法玩弄，是不是直接相關的一些額外的信息。最近我甚至可以通過驗證組來獲得這個工作（儘管目前沒有支持客戶端組之間的繼承關係）。這樣，您只需使用驗證約束來註釋字段屬性，並自動生成客戶端驗證代碼。不過，我是一名春季新手，所以我的方法可能不那麼幹淨。我也希望得到一些反饋，所以如果有人有興趣，請讓我知道。理想情況下（我希望我不要過於自命不凡），我想聯繫春天的人們，看看他們是否對此感興趣。

來源

2010-08-13 Vivin Paliath

我真的沒有一個用例來真正實踐它;但是，我會投票和最喜歡的，因爲它似乎是一個很好的概念。我很好奇看到人們做了什麼。我選擇的web框架，wicket，大多消除了對javascript驗證的需求，因爲它提供了提交數據和通過ajax請求從服務器生成反饋的功能。我知道像ASP.NET這樣的其他框架確實鼓勵客戶端驗證動態反饋（儘管您始終需要在表單提交時進行服務器驗證）。 – RMorrisey 2010-08-13 00:43:29

@Rororie謝謝你的評論！我還沒有試用過檢票口，但我想在某個時候看看它。我認爲JSF也有類似於你描述的東西。在工作中，我們有一些驗證只能在服務器端完成。通過我的框架，我可以像你描述的那樣在客戶端完成它。我有一個自定義的約束與驗證器，使AJAX請求執行驗證。再次感謝您的反饋！ – 2010-08-13 00:53:29

我知道這是脫離主題和關閉時間，但你是如何將註釋注入數據約束？我想到了如何做類似的事情（regula已經足夠滿足我的需求） – 2011-12-20 18:12:45

我很喜歡它，它保持我的html清潔，並且構建自定義驗證器的能力非常好。有一件事我加入是爲綁定驗證和提交功能的手短，包裹它作爲一個jQuery插件：

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); 
}

逸岸，我剛剛blogged它爲我留下深刻印象的與何潔很容易。我仍然會花時間瀏覽你的源代碼，看看你是如何完成的，但它是一個很好的開始:)

關於整合你的框架，我主要使用ASP.NET MVC，它會看看它是如何將服務器端驗證邏輯轉化爲客戶端約束的有趣之處。我可能會在下個月左右查看一些內容。

來源

2010-08-13 22:08:30

感謝您的反饋和博客文章Matthew！我主要工作在Java的一面;我從來沒有做過.NET，但我有興趣研究它！ – 2010-08-15 19:44:08

我一直在玩它多一點，並發現一種基於.NET的DataAnnotations命名空間提供的屬性自動生成數據約束的方法。我知道你是一個Java老兄，但如果你有興趣瞭解我如何做到這一點，我將以今晚的例子更新我的博客。我會想象在春天使用Beans的概念與Java的特點基本相似...... – 2010-08-17 16:50:49

Javascript form-validation framework：Request for Review

回答

相關問題