[發明專利]一種表單驗證方法及系統

在審

• 申請號: 201410203211.5
• 申請日: 2014-05-14
• 公開（公告）號: CN103984547A
• 公開（公告）日: 2014-08-13
• 發明（設計）人: 賈春樂
• 申請（專利權）人: 上海上訊信息技術股份有限公司
• 主分類號: G06F9/44
• 分類號: G06F9/44
• 代理公司: 上海百一領御專利代理事務所(普通合伙) 31243
• 代理人: 馬育麟

技術領域

本發明涉及web前端的表單驗證，尤其涉及一種表單驗證方法及系統。

背景技術

隨著表單驗證需求的日益復雜，數據格式的多樣化，一般的表單驗證方式代碼復用率低，開發效率不高，即使是封裝了若干驗證規則的函數去調用，前端或者前臺人員仍需要根據驗證流程寫大量的關于驗證過程和DOM操作的代碼。當前面臨的問題是如何保證只調用很少的API，只需要指定相應的驗證要求，就可以很快捷的去完成驗證過程，減少大量代碼的書寫，進行更集中化的封裝。

綜上可知，現有技術在實際使用上顯然存在不便與缺陷，所以有必要加以改進。

發明內容

針對上述的缺陷，本發明的目的在于提供一種表單驗證方法及系統，解決了表單驗證繁雜化，通過大量的代碼去實現驗證流程問題，使得很少的API調用就可以滿足表單驗證的需求。

為了實現上述目的，本發明提供一種表單驗證方法，所述方法包括如下步驟

定義表單元素驗證規則，并將所述驗證規則與配置項以DOM選擇器方式封裝到表單驗證插件中；

進行表單驗證時調用對表單綁定的統一配置驗證的表單驗證插件API和提交表單前的全局驗證的表單驗證插件API，進行全局驗證時對需要驗證的表單元素進行一次遍歷，逐一根據所設置的驗證規則進行驗證。

根據本發明的表單驗證方法，“將所述驗證規則與配置項以DOM選擇器方式封裝到表單驗證插件中”的步驟中，所述配置項包括提示框的主題配置，是否忽略隱藏元素驗證的配置以及進行自定義提示樣式的配置。

根據本發明的表單驗證方法，“定義表單元素驗證規則”的步驟中，所述驗證規則包括：自定義一個屬性名表示表單元素驗證名稱，屬性值定義驗證規則。

根據本發明的表單驗證方法，“定義表單元素驗證規則”的步驟中，所述驗證規則包括：采用自定義正則表達式或函數進行驗證。

根據本發明的表單驗證方法，提示框的主題配置包括輸入的提示和如果輸入不合理的錯誤提示；

自定義提示樣式的配置包括：將表單的提示樣式配置為懸浮框提示的方式。

本發明相應提供一種表單驗證系統，所述系統包括：

表單元素定義模塊，用于定義表單元素驗證規則，

封裝模塊，用于將所述驗證規則與配置項以DOM選擇器方式封裝到表單驗證插件中；

接口調用模塊，用于進行表單驗證時調用對表單綁定的統一配置驗證的表單驗證插件API和提交表單前的全局驗證的表單驗證插件API，進行全局驗證時對需要驗證的表單元素進行一次遍歷，逐一根據所設置的驗證規則進行驗證。

根據本發明的表單驗證系統，所述配置項包括提示框的主題配置，是否忽略隱藏元素驗證的配置以及進行自定義提示樣式的配置。

根據本發明的表單驗證系統，所述驗證規則包括：自定義一個屬性名表示表單元素驗證名稱，屬性值定義具體的驗證規則。

根據本發明的表單驗證系統，所述驗證規則包括：采用自定義正則表達式或函數進行驗證。

根據本發明的表單驗證系統，提示框的主題配置包括輸入的提示和如果輸入不合理的錯誤提示；自定義提示樣式的配置包括：將表單的提示樣式配置為懸浮框提示的方式。

根據本發明的表單驗證系統，提示框的主題配置包括輸入的提示和如果輸入不合理的錯誤提示；自定義提示樣式的配置包括：將表單的提示樣式配置為懸浮框提示的方式。

本發明通過定義表單元素驗證規則，并將所述驗證規則與配置項DOM選擇器方式封裝到表單驗證插件中；進行表單驗證時調用對表單綁定的統一配置驗證的API和提交表單前的全局驗證的API，進行全局驗證時對需要驗證的表單元素進行一次遍歷，逐一根據所設置的屬性進行驗證。進行一個表單驗證基本只需要調用兩個API，即對表單綁定的統一配置驗證的API和提交表單前的全局驗證的API，驗證規則只需根據所指定的屬性名屬性值去設置即可，不用再去為實現驗證流程而寫大量的js代碼，如果有比較特殊的驗證要求時，比如需要進行自定義驗證函數的設置時，才需要寫一些特殊驗證流程的代碼。而且提示方式也已用css設置，并且顯示控制也在插件內部進行封裝，省去了反復寫DOM操作的過程。所以達到了減少js代碼的目的。解決了表單驗證繁雜化，通過大量的代碼去實現驗證流程問題，使得很少的API調用就可以滿足表單驗證的需求。

附圖說明

圖1是本發明一種表單驗證系統的原理框圖；

圖2是本發明一種實施例中web前端進行表單驗證的驗證流程；

圖3是本發明一種表單驗證方法的流程圖。